twitter-bootstrap-rails 2.0 → 2.0.1

data/README.md

@@ -1,15 +1,15 @@
-# Twitter Bootstrap for Rails 3.2 Asset Pipeline
+# Twitter Bootstrap for Rails 3.1 Asset Pipeline
 Bootstrap is a toolkit from Twitter designed to kickstart development of webapps and sites. It includes base CSS and HTML for typography, forms, buttons, tables, grids, navigation, and more.
 
 
-twitter-bootstrap-rails project integrates Bootstrap CSS toolkit for Rails 3.2 Asset Pipeline
+twitter-bootstrap-rails project integrates Bootstrap CSS toolkit for Rails 3.1 Asset Pipeline (Rails 3.2 supported)
 
 
 ## Installing Gem
 
 Include Bootstrap in Gemfile;
 
-    gem 'twitter-bootstrap-rails'
+    gem 'twitter-bootstrap-rails', :group => :assets
 
 or you can install from latest build;
 
@@ -34,13 +34,13 @@ Usage:
     rails g bootstrap:install
 
 
-Layout (generates Twitter Bootstrap compatible layout.)
+Layout (generates Twitter Bootstrap compatible layout with flash messages) - (Haml and Slim supported)
 
 
 Usage:
 
 
-    rails g bootstrap:layout [LAYOUT_NAME] [*fixed or fluid] [options]
+    rails g bootstrap:layout [LAYOUT_NAME] [*fixed or fluid]
 
 
 Example:
@@ -49,19 +49,20 @@ Example:
     rails g bootstrap:layout application fixed
 
 
-Themed (generates Twitter Bootstrap compatible scaffold views.)
+Themed (generates Twitter Bootstrap compatible scaffold views.) - (Haml and Slim supported)
 
 
 Usage:
 
 
-    rails g bootstrap:themed [RESOURCE_NAME] [LAYOUT] [options]
+    rails g bootstrap:themed [RESOURCE_NAME]
 
 
 Example:
 
 
     rails g scaffold post title:string description:text
+    rake db:migrate
     rails g bootstrap:themed posts
 
 
@@ -82,12 +83,14 @@ You have to require Bootstrap LESS (bootstrap.less) in your application.css
 
 
 Now, you can override LESS files provided by Twitter Bootstrap
+Also, you can import additional files (.ie responsive)
 
-     @import "twitter/bootstrap";
+    @import "twitter/bootstrap";
 
-     // Baseline grid
-     @basefont:          13px;
-     @baseline:          18px;
+    // import responsive layout
+    @import "twitter/bootstrap/responsive";
+
+    // Your custom stylesheets goes here (override Less here)
 
 
 ## Using Javascripts
@@ -107,27 +110,17 @@ Using Twitter Bootstrap with the CoffeeScript is easy.
 twitter-bootstrap-rails generates a "bootstrap.js.coffee" file for you
 to /app/assets/javascripts/ folder.
 
-    $ ->
+    jQuery ->
       $(".alert-message").alert()
-    $ ->
       $(".tabs").button()
-    $ ->
       $(".carousel").carousel()
-    $ ->
       $(".collapse").collapse()
-    $ ->
       $(".dropdown-toggle").dropdown()
-    $ ->
-      $("#myModal").modal options
-    $ ->
-      $("#example").popover options
-    $ ->
-      $("#navbar").scrollspy()
-    $ ->
-      $("#myTab").tab "show"
-    $ ->
-      $("#example").tooltip options
-    $ ->
+      $(".modal").modal()
+      $("a[rel]").popover()
+      $(".navbar").scrollspy()
+      $(".tab").tab "show"
+      $(".tooltip").tooltip()
       $(".typeahead").typeahead()
 
 
@@ -159,6 +152,11 @@ twitter-bootstrap-rails has seperate branch (w/o Less) that just serves latest s
   <li>Added new generators (install, layout and themed)</li>
   <li>Compability to Rails 3.2</li>
   <li>Transitioning to 2.0</li>
+  <li>Released gem v.2.0rc0</li>
+  <li>Added Haml and Slim support</li>
+  <li>Added Twitter Bootstrap compatible flash messages</li>
+  <li>Added Responsive layout support</li>
+  <li>Fixes and release 2.0.0</li>
 </ul>
 
 
@@ -173,6 +171,8 @@ twitter-bootstrap-rails has seperate branch (w/o Less) that just serves latest s
   <li>Colin Warren</li>
   <li>Giovanni Cappellotto</li>
   <li>Masakuni Kato</li>
+  <li>Gudleik Rasch</li>
+  <li>Thomas Volkmar Worm</li>
 </ul>
 
 

data/Rakefile

@@ -1,3 +1,3 @@
+#!/usr/bin/env rake
 require 'bundler'
 Bundler::GemHelper.install_tasks
-

data/lib/generators/bootstrap/install/install_generator.rb

@@ -2,7 +2,7 @@ require 'rails/generators'
 
 module Bootstrap
   module Generators
-    class InstallGenerator < Rails::Generators::Base
+    class InstallGenerator < ::Rails::Generators::Base
       source_root File.expand_path("../templates", __FILE__)
       desc "This generator installs Twitter Bootstrap to Asset Pipeline"
 

data/lib/generators/bootstrap/install/templates/bootstrap.coffee

@@ -1,22 +1,12 @@
-$ ->
+jQuery ->
   $(".alert-message").alert()
-$ ->
   $(".tabs").button()
-$ ->
   $(".carousel").carousel()
-$ ->
   $(".collapse").collapse()
-$ ->
   $(".dropdown-toggle").dropdown()
-$ ->
-  $(".modal").modal
-$ ->
-  $("a[rel]").popover
-$ ->
+  $(".modal").modal()
+  $("a[rel]").popover()
   $(".navbar").scrollspy()
-$ ->
   $(".tab").tab "show"
-$ ->
-  $(".tooltip").tooltip
-$ ->
-  $(".typeahead").typeahead()  
+  $(".tooltip").tooltip()
+  $(".typeahead").typeahead() 

data/lib/generators/bootstrap/install/templates/bootstrap.less

@@ -1,5 +1,6 @@
 @import "twitter/bootstrap";
 
-// Baseline grid
-@basefont:          13px;
-@baseline:          18px;
+// import responsive layout
+@import "twitter/bootstrap/responsive";
+
+// Your custom stylesheets goes here (override Less here)

data/lib/generators/bootstrap/layout/layout_generator.rb

@@ -2,21 +2,31 @@ require 'rails/generators'
 
 module Bootstrap
   module Generators
-    class LayoutGenerator < Rails::Generators::Base
+    class LayoutGenerator < ::Rails::Generators::Base
       source_root File.expand_path("../templates", __FILE__)
-      desc "This generator creates layout file with navigation."
+      desc "This generator generates layout file with navigation."
       argument :layout_name, :type => :string, :default => "application"
       argument :layout_type, :type => :string, :default => "fixed",
                :banner => "*fixed or fluid"
 
       attr_reader :app_name, :container_class
 
+      def add_helper
+       if File.exists?(Rails.root.join("app/helpers/application_helper.rb"))
+          say "Bootstrap helpers installs to application_helper..."
+          insert_into_file "app/helpers/application_helper.rb",
+          "  def flash_class(level)\n  case level\n  when :notice then 'info'\n  when :error then 'error'\n  when :alert then 'warning'\n  end\n  end\n", :after => "module ApplicationHelper\n"
+       else
+          say "Already installed"
+       end
+      end
+
       def generate_layout
-        app = Rails.application
+        app = ::Rails.application
         @app_name = app.class.to_s.split("::").first
         @container_class = layout_type == "fluid" ? "container-fluid" : "container"
         ext = app.config.generators.options[:rails][:template_engine] || :erb
-        template "layout.html.erb", "app/views/layouts/#{layout_name}.html.erb"
+        template "layout.html.#{ext}", "app/views/layouts/#{layout_name}.html.#{ext}"
       end
     end
   end

data/lib/generators/bootstrap/layout/templates/layout.html.erb

@@ -1,57 +1,120 @@
 <!DOCTYPE html>
-<html>
-<head>
-  <title><%= app_name %></title>
-  <%%= stylesheet_link_tag    "application" %>
-  <%%= javascript_include_tag "application" %>
-  <%%= csrf_meta_tags %>
-</head>
-<body style="padding-top: 60px">
-  <div class="topbar">
-    <div class="topbar-inner">
-      <div class="<%= container_class %>">
-        <h3><%%= link_to "<%= app_name %>", "/" %></h3>
-        <ul class="nav">
-        <%- (1..3).each do |i| -%>
-          <li><%%= link_to "Link<%= i %>", "/path<%= i %>"  %></li>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <title><%= app_name %></title>
+    <%%= csrf_meta_tags %>
+
+    <!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
+    <!--[if lt IE 9]>
+      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js" type="text/javascript"></script>
+    <![endif]-->
+
+    <!-- Le styles -->
+    <%%= stylesheet_link_tag    "application", :media => "all" %>
+    <style>
+      body {
+        padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
+      }
+    </style>
+
+    <!-- Le fav and touch icons -->
+    <link href="images/favicon.ico" rel="shortcut icon">
+    <link href="images/apple-touch-icon.png" rel="apple-touch-icon">
+    <link href="images/apple-touch-icon-72x72.png" rel="apple-touch-icon" sizes="72x72">
+    <link href="images/apple-touch-icon-114x114.png" rel="apple-touch-icon" sizes="114x114">
+  </head>
+  <body>
+
+    <div class="navbar navbar-fixed-top">
+      <div class="navbar-inner">
+        <%- if layout_type == "fluid" -%>
+          <div class="container-fluid">
+        <%- else -%>
+          <div class="container">
         <%- end -%>
-        </ul>
-      </div>
-    </div>
-  </div>
-  <div class="<%= container_class %>">
-  <%- if layout_type == "fluid" -%>
-    <div class="sidebar">
-      <div class="well">
-        <h5>Sidebar</h5>
-        <ul>
-        <%- (1..3).each do |i| -%>
-          <li><%%= link_to "Link<%= i %>", "/path<%= i %>"  %></li>
-        <%- end -%>
-        </ul>
+          <a class="btn btn-navbar" data-target=".nav-collapse" data-toggle="collapse">
+            <span class="i-bar"></span>
+            <span class="i-bar"></span>
+            <span class="i-bar"></span>
+          </a>
+          <a class="brand" href="#"><%= app_name %></a>
+          <div class="<%= container_class %> nav-collapse">
+            <ul class="nav">
+              <%- (1..3).each do |i| -%>
+                <li><%%= link_to "Link<%= i %>", "/path<%= i %>"  %></li>
+              <%- end -%>
+            </ul>
+          </div><!--/.nav-collapse -->
+        </div>
       </div>
     </div>
-    <div class="content">
-      <%%= yield %>
-    </div>
-  <%- else -%>
-    <div class="content">
-      <div class="row">
-        <div class="span11">
+
+    <div class="<%= container_class %>">
+      <%- if layout_type == "fluid" -%>
+       <div class="row-fluid">
+        <div class="span3">
+          <div class="well sidebar-nav">
+            <ul class="nav nav-list">
+              <li class="nav-header">Sidebar</li>
+              <%- (1..3).each do |i| -%>
+              <li><%%= link_to "Link<%= i %>", "/path<%= i %>"  %></li>
+            <%- end -%>
+            </ul>
+          </div><!--/.well -->
+        </div><!--/span-->
+        <div class="span9">
+          <%% [:notice, :error, :alert].each do |level| %>
+            <%% unless flash[level].blank? %>
+              <div data-alert="alert" class="alert alert-<%%= flash_class(level) %> fade in">
+                <a class="close" data-dismiss="alert" href="#">&times;</a>
+                <%%= content_tag :p, flash[level] %>
+              </div>
+            <%% end %>
+          <%% end %>
           <%%= yield %>
         </div>
-        <div class="span1">&nbsp;</div>
-        <div class="span4">
-          <h3>Sidebar</h3>
-          <ul>
-          <%- (1..3).each do |i| -%>
-            <li><%%= link_to "Link<%= i %>", "/path<%= i %>"  %></li>
-          <%- end -%>
-          </ul>
+      </div><!--/row-->
+      <%- else -%>
+        <div class="content">
+          <div class="row">
+            <div class="span9">
+            <%% [:notice, :error, :alert].each do |level| %>
+            <%% unless flash[level].blank? %>
+             <div data-alert="alert" class="alert alert-<%%= flash_class(level) %> fade in">
+                <a class="close" data-dismiss="alert" href="#">&times;</a>
+                <%%= content_tag :p, flash[level] %>
+              </div>
+              <%% end %>
+            <%% end %>
+            <%%= yield %>
+            </div>
+            <div class="span1">&nbsp;</div>
+            <div class="span3">
+              <div class="well sidebar-nav">
+                <h3>Sidebar</h3>
+                 <ul class="nav nav-list">
+                    <li class="nav-header">Sidebar</li>
+                  <%- (1..3).each do |i| -%>
+                    <li><%%= link_to "Link<%= i %>", "/path<%= i %>"  %></li>
+                  <%- end -%>
+                </ul>
+            </div>
+           </div>
+          </div>
         </div>
-      </div>
-    </div>
-  <%- end -%>
-  </div>
-</body>
+      <%- end -%>
+
+      <footer>
+        <p>&copy; Company 2012</p>
+      </footer>
+
+    </div> <!-- /container -->
+
+    <!-- Le javascript
+    ================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+    <%%= javascript_include_tag "application" %>
+
+  </body>
 </html>

data/lib/generators/bootstrap/layout/templates/layout.html.haml

@@ -0,0 +1,90 @@
+!!! 5
+%html{:lang => "en"}
+  %head
+    %meta{:charset => "utf-8"}/
+    %title= content_for?(:title) ? yield(:title) : "<%= app_name %>"
+    = csrf_meta_tags
+    / Le HTML5 shim, for IE6-8 support of HTML elements
+    /[if lt IE 9]
+      = javascript_include_tag "http://html5shim.googlecode.com/svn/trunk/html5.js"
+    / Le styles
+    = stylesheet_link_tag    "application"
+    :css
+      body {
+        padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
+      }
+    / Le fav and touch icons
+    %link{:href => "images/favicon.ico", :rel => "shortcut icon"}/
+    %link{:href => "images/apple-touch-icon.png", :rel => "apple-touch-icon"}/
+    %link{:href => "images/apple-touch-icon-72x72.png", :rel => "apple-touch-icon", :sizes => "72x72"}/
+    %link{:href => "images/apple-touch-icon-114x114.png", :rel => "apple-touch-icon", :sizes => "114x114"}/
+
+
+  %body
+    .navbar.navbar-fixed-top
+      .navbar-inner
+        <%- if layout_type == "fluid" -%>
+        .container-fluid
+        <%- else -%>
+        .container
+        <%- end -%>
+          %a.btn.btn-navbar{"data-target" => ".nav-collapse", "data-toggle" => "collapse"}
+            %span.i-bar
+            %span.i-bar
+            %span.i-bar
+          %a.brand{:href => "#"}<%= app_name %>
+          .<%=container_class%>.nav-collapse
+            %ul.nav
+              %li= link_to "Link 1", "/path1"
+              %li= link_to "Link 2", "/path2"
+              %li= link_to "Link 3", "/path3"
+
+    .<%= container_class %>
+    <%- if layout_type == "fluid" -%>
+
+      .row-fluid
+        .span3
+          .well.sidebar-nav
+            %ul.nav.nav-list
+              %li.nav-header Sidebar
+              %li= link_to "Link 1", "/path1"
+              %li= link_to "Link 2", "/path2"
+              %li= link_to "Link 3", "/path3"
+        .span9
+        <% [:notice, :error, :alert].each do |level| %>
+          <% unless flash[level].blank? %>
+          .alert.fade.in{:class => "alert-<%= flash_class(level) %>", "data-alert" => "alert"}
+            %a.close{"data-dismiss" => "alert", :href => "#"} ×
+            <%= content_tag :p, flash[level] %>
+          <% end %>
+          <% end %>
+          = yield
+    <% else %>
+      .content
+        .row
+          .span9
+          <% [:notice, :error, :alert].each do |level| %>
+            <% unless flash[level].blank? %>
+            .alert.fade.in{:class => "alert-<%= flash_class(level) %>", "data-alert" => "alert"}
+            %a.close{"data-dismiss" => "alert", :href => "#"} ×
+            <%= content_tag :p, flash[level] %>
+            <% end %>
+          <% end %>
+            = yield
+          .span1 &nbsp;
+          .span3
+            .well.sidebar-nav
+              %h3 Sidebar
+              %ul.nav.nav-list
+                %li.nav-header Sidebar
+                %li= link_to "Link 1", "/path1"
+                %li= link_to "Link 2", "/path2"
+                %li= link_to "Link 3", "/path3"
+    <% end %>
+      %footer
+        %p &copy; Company 2012
+    /
+      Le javascript
+      \==================================================
+    / Placed at the end of the document so the pages load faster
+    = javascript_include_tag "application"