bootstrap-generators 1.4.0 → 2.0.0

data/README.md

@@ -2,47 +2,264 @@
 
 Bootstrap-generators provides Twitter Bootstrap generators for Rails 3.1. Bootstrap is a toolkit from Twitter designed to kickstart development of webapps and sites. Checkout http://twitter.github.com/bootstrap.
 
-## Rails 3.1 setup
+## Installing Gem
 
-This gem requires the use of rails 3.1.
+In your Gemfile, add this line:
 
-### Installation
+    gem 'bootstrap-generators', '~> 2.0'
 
-In your Gemfile, add this line:
+Or you can install from latest build:
 
-  `gem 'bootstrap-generators'`
+    gem 'bootstrap-generators', '~> 2.0', :git => 'git://github.com/decioferreira/bootstrap-generators.git'
 
 By default Bootstrap Generators requires SimpleForm. Add the dependency on your Gemfile:
 
-  `gem 'simple_form', '~> 1.5'`
+    gem 'simple_form', :git => 'git://github.com/plataformatec/simple_form.git'
+
+If you don't want to use SimpleForm, just pass the `--form_builder=form_builder` option:
+
+    rails generate bootstrap:install --form_builder=form_builder
+
+We recommended you to use LESS as the stylesheet engine, so that you can [customize][] and extend Bootstrap to take advantage of the variables, mixins, and more. Add the dependency on your Gemfile:
 
-If you don't want to use SimpleForm, and instead use the default Rails form builder, just call the install generator with `--form_builder=form_builder`.
+    gem 'less-rails'
 
-Then run the following commands:
+Then you just have to pass `--stylesheet-engine==less` option:
 
-  `bundle install`
+    rails generate bootstrap:install --stylesheet-engine==less
 
-  `rails generate bootstrap:install`
+Run bundle install:
+
+    bundle install
+
+## Generators
+
+Get started:
+
+    rails generate bootstrap:install
 
 Once you've done that, any time you generate a controller or scaffold, you'll get [Bootstrap](http://twitter.github.com/bootstrap/) templates.
 
-## Form builders
+### Give it a try
+
+    rails generate scaffold post title:string body:text published:boolean
+
+## Usage
+
+To print the options and usage run the command `rails generate bootstrap:install --help`
+
+    rails generate bootstrap:install [options]
+
+    Options:
+          [--layout=LAYOUT]                         # Bootstrap layout templates (hero or fluid)
+                                                    # Default: hero
+          [--form-builder=FORM_BUILDER]             # Select your form builder (simple_form or form_builder)
+                                                    # Default: simple_form
+      -e, [--template-engine=TEMPLATE_ENGINE]       # Indicates when to generate template engine
+                                                    # Default: erb
+      -se, [--stylesheet-engine=STYLESHEET_ENGINE]  # Indicates when to generate stylesheet engine
+                                                    # Default: scss
+
+    Runtime options:
+      -f, [--force]    # Overwrite files that already exist
+      -p, [--pretend]  # Run but do not make any changes
+      -q, [--quiet]    # Supress status output
+      -s, [--skip]     # Skip files that already exist
+
+    Copy BootstrapGenerators default files
+
+### Options
+
+#### Layouts
+
+There are the two available layouts, based on Bootstrap's quick-start examples:
+
+* [Basic marketing site](http://twitter.github.com/bootstrap/examples/hero.html) (default)
+* [Fluid layout](http://twitter.github.com/bootstrap/examples/fluid.html)
+
+To select one of these layouts just pass the option `--layout=LAYOUT` to the install generator.
+
+#### Form builders
+
+* SimpleForm
+
+By default Bootstrap Generators requires SimpleForm. Add the dependency on your Gemfile:
+
+    gem 'simple_form', :git => 'git://github.com/plataformatec/simple_form.git'
+
+And then run:
+
+    rails generate bootstrap:install --form_builder=simple_form
+
+* Default Rails form builder
+
+If you don't want to use SimpleForm, just pass the `--form_builder=form_builder` option:
+
+    rails generate bootstrap:install --form_builder=form_builder
+
+#### Template engines
+
+Supported template engines:
+
+* ERB
+* Haml
+
+Add the dependency on your Gemfile:
+
+    gem 'haml-rails'
+
+And then run:
+
+    rails generate bootstrap:install --template-engine=haml
+
+#### Stylesheet engines
+
+Supported stylesheet engines:
+
+* LESS (recommended)
+
+Add the dependency on your Gemfile:
+
+    gem 'less-rails'
+
+And then run:
+
+    rails generate bootstrap:install --template-engine=haml
+
+Now you can [customize][] the look and feel of Bootstrap.
+
+* CSS
+* SCSS
+
+## Assets
+
+<a name="customize"></a>
+
+### Customize and extend Bootstrap with LESS
+
+Customize and extend Bootstrap with [LESS](http://lesscss.org/), a CSS preprocessor, to take advantage of the variables, mixins, and more used to build Bootstrap's CSS.
+
+If you select LESS as your stylesheet engine, you will get an `app/assets/stylesheets/bootstrap-generators.css.less` file with all of the [default variables](http://twitter.github.com/bootstrap/less.html#variables) of Bootstrap. This way you can [customize](http://twitter.github.com/bootstrap/download.html#variables) the look and feel of Bootstrap without having to download any extra file:
+
+    // Variables to customize the look and feel of Bootstrap
+    // -----------------------------------------------------
+
+
+
+    // GLOBAL VALUES
+    // --------------------------------------------------
+
+    // Links
+    @linkColor:             #08c;
+    @linkColorHover:        darken(@linkColor, 15%);
+
+    // Grays
+    @black:                 #000;
+    @grayDarker:            #222;
+    @grayDark:              #333;
+    @gray:                  #555;
+    @grayLight:             #999;
+    @grayLighter:           #eee;
+    @white:                 #fff;
+
+    // Accent colors
+    @blue:                  #049cdb;
+    @blueDark:              #0064cd;
+    @green:                 #46a546;
+    @red:                   #9d261d;
+    @yellow:                #ffc40d;
+    @orange:                #f89406;
+    @pink:                  #c3325f;
+    @purple:                #7a43b6;
+
+    // Typography
+    @baseFontSize:          13px;
+    @baseFontFamily:        "Helvetica Neue", Helvetica, Arial, sans-serif;
+    @baseLineHeight:        18px;
+    @textColor:             @grayDark;
+
+    // Buttons
+    @primaryButtonBackground:    @linkColor;
+
+
+
+    // COMPONENT VARIABLES
+    // --------------------------------------------------
+
+    // Z-index master list
+    // Used for a bird's eye view of components dependent on the z-axis
+    // Try to avoid customizing these :)
+    @zindexDropdown:        1000;
+    @zindexPopover:         1010;
+    @zindexTooltip:         1020;
+    @zindexFixedNavbar:     1030;
+    @zindexModalBackdrop:   1040;
+    @zindexModal:           1050;
+
+    // Input placeholder text color
+    @placeholderText:       @grayLight;
+
+    // Navbar
+    @navbarHeight:                    40px;
+    @navbarBackground:                @grayDarker;
+    @navbarBackgroundHighlight:       @grayDark;
+
+    @navbarText:                      @grayLight;
+    @navbarLinkColor:                 @grayLight;
+    @navbarLinkColorHover:            @white;
+
+    // Form states and alerts
+    @warningText:             #c09853;
+    @warningBackground:       #fcf8e3;
+    @warningBorder:           darken(spin(@warningBackground, -10), 3%);
+
+    @errorText:               #b94a48;
+    @errorBackground:         #f2dede;
+    @errorBorder:             darken(spin(@errorBackground, -10), 3%);
+
+    @successText:             #468847;
+    @successBackground:       #dff0d8;
+    @successBorder:           darken(spin(@successBackground, -10), 5%);
+
+    @infoText:                #3a87ad;
+    @infoBackground:          #d9edf7;
+    @infoBorder:              darken(spin(@infoBackground, -10), 7%);
+
+
+
+    // GRID
+    // --------------------------------------------------
 
-### Default Rails form builder
+    // Default 940px grid
+    @gridColumns:             12;
+    @gridColumnWidth:         60px;
+    @gridGutterWidth:         20px;
+    @gridRowWidth:            (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1));
 
-  `rails generate bootstrap:install --form_builder=form_builder`
+    // Fluid grid
+    @fluidGridColumnWidth:    6.382978723%;
+    @fluidGridGutterWidth:    2.127659574%;
 
-### SimpleForm
 
-  `rails generate bootstrap:install --form_builder=simple_form`
+### Javascript
 
-## Layouts
+Select all jQuery plugins (`app/assets/javascripts/bootstrap.js`)
 
-There are three layouts available, based on the quick-start examples:
+    //= require bootstrap
 
-* hero (default; based on [this template](http://twitter.github.com/bootstrap/examples/hero.html))
-* fluid (based on [this template](http://twitter.github.com/bootstrap/examples/fluid.html))
-* container-app (based on [this template](http://twitter.github.com/bootstrap/examples/container-app.html))
+Or quickly add only the necessary javascript (Transitions: required for any animation; Popovers: requires Tooltips)
 
-To select one of these layouts just pass the option '--layout=LAYOUT' to the install generator.
+    //= require bootstrap-transition
+    //= require bootstrap-alert
+    //= require bootstrap-modal
+    //= require bootstrap-dropdown
+    //= require bootstrap-scrollspy
+    //= require bootstrap-tab
+    //= require bootstrap-tooltip
+    //= require bootstrap-popover
+    //= require bootstrap-button
+    //= require bootstrap-collapse
+    //= require bootstrap-carousel
+    //= require bootstrap-typeahead
 
+[customize]: #customize

data/bootstrap-generators.gemspec

@@ -9,7 +9,7 @@ Gem::Specification.new do |s|
   s.email       = ["decio.ferreira@decioferreira.com"]
   s.homepage    = "https://github.com/decioferreira/bootstrap-generators"
   s.summary     = %q{Bootstrap-generators provides Twitter Bootstrap generators for Rails 3.1.}
-  s.description = %q{Bootstrap-generators provides Twitter Bootstrap generators for Rails 3.1. Bootstrap is a toolkit from Twitter designed to kickstart development of webapps and sites. Checkout http://twitter.github.com/bootstrap.}
+  s.description = %q{Bootstrap-generators provides Twitter Bootstrap generators for Rails 3.1. Checkout http://twitter.github.com/bootstrap.}
 
   s.rubyforge_project = "bootstrap-generators"
 
@@ -24,7 +24,7 @@ Gem::Specification.new do |s|
 
   s.add_development_dependency "bundler", "~> 1.0.0"
   s.add_development_dependency "test-unit"
-  s.add_development_dependency "rails", "~> 3.1.0"
+  s.add_development_dependency "rails", "~> 3.1"
 
-  s.add_runtime_dependency "railties", "~> 3.1.0"
+  s.add_runtime_dependency "railties", "~> 3.1"
 end

data/lib/bootstrap-generators.rb

@@ -1,5 +1,4 @@
 require 'rails'
-require 'bootstrap/helpers/form_builder'
 
 module Bootstrap
   module Generators

data/lib/bootstrap/generators/version.rb

@@ -1,5 +1,5 @@
 module Bootstrap
   module Generators
-    VERSION = "1.4.0"
+    VERSION = "2.0.0"
   end
 end

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

@@ -3,10 +3,10 @@ require 'rails'
 module Bootstrap
   module Generators
     class InstallGenerator < ::Rails::Generators::Base
-      desc "Copy BootstrapGenerators default files"
+      desc 'Copy BootstrapGenerators default files'
       source_root File.expand_path('../templates', __FILE__)
-      class_option :layout, :desc => "Bootstrap layout templates (hero, fluid or container-app)", :default => "hero", :type => :string
-      class_option :form_builder, :desc => "Select your form builder (form_builder or simple_form)", :default => "simple_form", :type => :string
+      class_option :layout, :desc => 'Bootstrap layout templates (hero or fluid)', :default => 'hero', :type => :string
+      class_option :form_builder, :desc => 'Select your form builder (simple_form or form_builder)', :default => 'simple_form', :type => :string
 
       class_option :template_engine
       class_option :stylesheet_engine
@@ -23,14 +23,8 @@ module Bootstrap
         end
       end
 
-      def copy_simple_form_inputs
-        if options[:form_builder] == "simple_form"
-          directory 'app'
-        end
-      end
-
       def copy_simple_form_config
-        if options[:form_builder] == "simple_form"
+        if options[:form_builder] == 'simple_form'
           directory 'config'
         end
       end
@@ -47,9 +41,8 @@ module Bootstrap
         end
 
         copy_file "assets/stylesheets/#{options[:layout]}.#{stylesheet_extension}", "app/assets/stylesheets/bootstrap-generators.#{stylesheet_extension}"
-        copy_file "assets/javascripts/bootstrap-generators.js", "app/assets/javascripts/bootstrap-generators.js"
+        copy_file 'assets/javascripts/bootstrap-generators.js', 'app/assets/javascripts/bootstrap-generators.js'
       end
     end
   end
 end
-

data/lib/generators/bootstrap/install/templates/assets/stylesheets/fluid.css

@@ -4,6 +4,11 @@
 
 body {
   padding-top: 60px;
+  padding-bottom: 40px;
+}
+
+.sidebar-nav {
+  padding: 9px 0;
 }
 
 .page-header a.btn {
@@ -13,8 +18,3 @@ body {
 .page-header a.btn + a.btn {
   margin-right: 8px;
 }
-
-.form-stacked div.alert-message {
-  margin-left: -10px;
-}
-

data/lib/generators/bootstrap/install/templates/assets/stylesheets/fluid.css.less

@@ -0,0 +1,119 @@
+@import "less/bootstrap";
+
+body {
+  padding-top: 60px;
+  padding-bottom: 40px;
+}
+
+.sidebar-nav {
+  padding: 9px 0;
+}
+
+.page-header {
+  a.btn {
+    float: right;
+  }
+
+  a.btn + a.btn {
+    margin-right: 8px;
+  }
+}
+
+// Variables to customize the look and feel of Bootstrap
+// -----------------------------------------------------
+
+
+
+// GLOBAL VALUES
+// --------------------------------------------------
+
+// Links
+@linkColor:             #08c;
+@linkColorHover:        darken(@linkColor, 15%);
+
+// Grays
+@black:                 #000;
+@grayDarker:            #222;
+@grayDark:              #333;
+@gray:                  #555;
+@grayLight:             #999;
+@grayLighter:           #eee;
+@white:                 #fff;
+
+// Accent colors
+@blue:                  #049cdb;
+@blueDark:              #0064cd;
+@green:                 #46a546;
+@red:                   #9d261d;
+@yellow:                #ffc40d;
+@orange:                #f89406;
+@pink:                  #c3325f;
+@purple:                #7a43b6;
+
+// Typography
+@baseFontSize:          13px;
+@baseFontFamily:        "Helvetica Neue", Helvetica, Arial, sans-serif;
+@baseLineHeight:        18px;
+@textColor:             @grayDark;
+
+// Buttons
+@primaryButtonBackground:    @linkColor;
+
+
+
+// COMPONENT VARIABLES
+// --------------------------------------------------
+
+// Z-index master list
+// Used for a bird's eye view of components dependent on the z-axis
+// Try to avoid customizing these :)
+@zindexDropdown:        1000;
+@zindexPopover:         1010;
+@zindexTooltip:         1020;
+@zindexFixedNavbar:     1030;
+@zindexModalBackdrop:   1040;
+@zindexModal:           1050;
+
+// Input placeholder text color
+@placeholderText:       @grayLight;
+
+// Navbar
+@navbarHeight:                    40px;
+@navbarBackground:                @grayDarker;
+@navbarBackgroundHighlight:       @grayDark;
+
+@navbarText:                      @grayLight;
+@navbarLinkColor:                 @grayLight;
+@navbarLinkColorHover:            @white;
+
+// Form states and alerts
+@warningText:             #c09853;
+@warningBackground:       #fcf8e3;
+@warningBorder:           darken(spin(@warningBackground, -10), 3%);
+
+@errorText:               #b94a48;
+@errorBackground:         #f2dede;
+@errorBorder:             darken(spin(@errorBackground, -10), 3%);
+
+@successText:             #468847;
+@successBackground:       #dff0d8;
+@successBorder:           darken(spin(@successBackground, -10), 5%);
+
+@infoText:                #3a87ad;
+@infoBackground:          #d9edf7;
+@infoBorder:              darken(spin(@infoBackground, -10), 7%);
+
+
+
+// GRID
+// --------------------------------------------------
+
+// Default 940px grid
+@gridColumns:             12;
+@gridColumnWidth:         60px;
+@gridGutterWidth:         20px;
+@gridRowWidth:            (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1));
+
+// Fluid grid
+@fluidGridColumnWidth:    6.382978723%;
+@fluidGridGutterWidth:    2.127659574%;