README.md in bootstrap-sass-extras-0.0.5 vs README.md in bootstrap-sass-extras-0.0.6
- old
+ new
@@ -3,10 +3,14 @@
[bootstrap-sass][1] extras, idea and codes from [twitter-bootstrap-rails][2]
[1]: https://github.com/thomas-mcdonald/bootstrap-sass
[2]: https://github.com/seyhunak/twitter-bootstrap-rails
+## Note
+
+From version 0.0.6, only support bootstrap 3. If you want to use bootstrap 2, please use version 0.0.5.
+
## Installation
Add this line to your application's Gemfile:
gem 'bootstrap-sass-extras'
@@ -26,92 +30,97 @@
Generate locale
Usage:
+```ruby
+rails g bootstrap:install
+```
- rails g bootstrap:install
-
-
Layout (generates Twitter Bootstrap compatible layout) - (Haml and Slim supported)
Usage:
+```ruby
+rails g bootstrap:layout [LAYOUT_NAME] [*fixed or fluid]
+```
- rails g bootstrap:layout [LAYOUT_NAME] [*fixed or fluid]
-
-
Example of a fixed layout:
+```ruby
+rails g bootstrap:layout application fixed
+```
- rails g bootstrap:layout application fixed
-
-
Example of a responsive layout:
+```ruby
+rails g bootstrap:layout application fluid
+```
- rails g bootstrap:layout application fluid
-
-
Themed (generates Twitter Bootstrap compatible scaffold views.) - (Haml and Slim supported)
Usage:
+```ruby
+rails g bootstrap:themed [RESOURCE_NAME]
+```
- rails g bootstrap:themed [RESOURCE_NAME]
-
-
Example:
+```ruby
+rails g scaffold Post title:string description:text
+rake db:migrate
+rails g bootstrap:themed Posts
+```
- rails g scaffold Post title:string description:text
- rake db:migrate
- rails g bootstrap:themed Posts
-
Notice the plural usage of the resource to generate bootstrap:themed.
## Using Helpers
### Viewport Meta Helper
Add the viewport meta helper `<%= viewport_meta_tag %>` to your layout
(built-in with layout generator) to render the required meta tag for Bootstrap:
- <meta content="width=device-width,initial-scale=1.0" name="viewport" />
+```html
+<meta content="width=device-width,initial-scale=1.0" name="viewport" />
+```
You can change the content value by passing a hash as an argument:
- <%= viewport_meta_tag(:maximum_scale => "1.0") %>
+```erb
+<%= viewport_meta_tag(:maximum_scale => "1.0") %>
+```
Renders:
- <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0" name="viewport" />
+```html
+<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0" name="viewport" />
+```
### Flash helper
Add flash helper `<%= bootstrap_flash %>` to your layout (built-in with layout generator)
### Modal Helper
You can create modals easily using the following example. The header, body, and footer all accept content_tag or plain html.
-The href of the button to launch the modal must matche the id of the modal dialog.
+The href of the button to launch the modal must match the id of the modal dialog.
-```ruby
-<%= content_tag :a, "Modal", :href => "#modal", :class => 'btn', :data => {:toggle => modal'} %>
-
+```erb
+<%= modal_toggle 'Modal', dialog: '#modal'%>
<%= modal_dialog :id => "modal",
- :header => { :show_close => true, :dismiss => 'modal', :title => 'Modal header' },
- :body => 'This is the body',
- :footer => content_tag(:button, 'Save', :class => 'btn') %>
+ :header => { :show_close => true, :title => 'Modal header' },
+ :body => 'This is the body',
+ :footer => content_tag(:button, 'Save', :class => 'btn btn-primary')
+%>
```
### Breadcrumbs Helpers
*Notice* If your application is using [breadcrumbs-on-rails](https://github.com/weppos/breadcrumbs_on_rails) you will have a namespace collision with the add_breadcrumb method.
You do not need to use these breadcrumb gems since this gem provides the same functionality out of the box without the additional dependency.
-Add breadcrumbs helper `<%= render_breadcrumbs %>` to your layout.
-
```ruby
class ApplicationController
add_breadcrumb :index, :root_path
end
```
@@ -124,21 +133,66 @@
end
def show
@example = Example.find params[:id]
add_breadcrumb @example.name, example_path(@example)
- # add_breadcrumb :show, example_path(@example)
+ add_breadcrumb :show, example_path(@example)
end
end
```
-### Glyp Helper
+Finally, add the `<%= render_breadcrumbs %>` helper to your layout.
+You can wrap the breadcrumbs in an HTML element by using the block form like this:
+
+```erb
+<%= render_breadcrumbs do |breadcrumbs| %>
+ <%= content_tag(:div, breadcrumbs, class: "container") %>
+<% end %>
+
+# =>
+# <div class="container">
+# <ol class="breadcrumb">
+# <li> ... </li>
+# <li class="active"> ... </li>
+# </ol>
+# </div>
+```
+
+There are also a few interface methods available for working with the internal breadcrumbs hashes. The following methods are available in controllers and views.
+
```ruby
-glyph(:share_alt)
-# => <i class="icon-share-alt"></i>
-glyph(:lock, :white)
-# => <i class="icon-lock icon-white"></i>
+# Given previously added breadcrumbs:
+
+breadcrumbs?
+# => true
+
+breadcrumb_names
+# => ["example", "show"]
+```
+
+The following method is available to controllers only.
+
+```ruby
+clear_breadcrumbs
+# => nil
+```
+
+### Glyph Helper
+
+```erb
+<%= glyph(:star) %>
+# => <span class="glyphicon glyphicon-star"></span>
+
+<%= glyph(:star, :paperclip) %>
+# => <span class="glyphicon glyphicon-star"></span><span class="glyphicon glyphicon-paperclip"></span>
+```
+
+### Badge Helper
+
+```erb
+<%= badge(2) %>
+# => <span class="badge">2</span>
```
## Contributing
1. Fork it