bootstrap-generators 2.0.0 → 2.0.1

data/.rvmrc

@@ -0,0 +1 @@
+rvm use @bootstrap-generators

data/README.md

@@ -1,6 +1,6 @@
 # Bootstrap Generators
 
-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.
+Bootstrap-generators provides [Twitter Bootstrap](http://twitter.github.com/bootstrap/) generators for Rails 3.1. Bootstrap is a toolkit from Twitter designed to kickstart development of webapps and sites. Checkout http://decioferreira.github.com/bootstrap-generators.
 
 ## Installing Gem
 
@@ -12,22 +12,14 @@ Or you can install from latest build:
 
     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:
+By default Bootstrap Generators requires [SimpleForm 2.0.0.rc](https://github.com/plataformatec/simple_form). Add the dependency on your Gemfile:
 
-    gem 'simple_form', :git => 'git://github.com/plataformatec/simple_form.git'
+    gem 'simple_form', '2.0.0.rc'
 
 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:
-
-    gem 'less-rails'
-
-Then you just have to pass `--stylesheet-engine==less` option:
-
-    rails generate bootstrap:install --stylesheet-engine==less
-
 Run bundle install:
 
     bundle install
@@ -44,6 +36,8 @@ Once you've done that, any time you generate a controller or scaffold, you'll ge
 
     rails generate scaffold post title:string body:text published:boolean
 
+You can easily [customize colors, grid system, fonts, and much more](http://decioferreira.github.com/bootstrap-generators) with Bootstrap-generators and LESS or SCSS. Visit http://decioferreira.github.com/bootstrap-generators.
+
 ## Usage
 
 To print the options and usage run the command `rails generate bootstrap:install --help`
@@ -83,9 +77,9 @@ To select one of these layouts just pass the option `--layout=LAYOUT` to the ins
 
 * SimpleForm
 
-By default Bootstrap Generators requires SimpleForm. Add the dependency on your Gemfile:
+By default Bootstrap Generators requires SimpleForm 2.0.0.rc. Add the dependency on your Gemfile:
 
-    gem 'simple_form', :git => 'git://github.com/plataformatec/simple_form.git'
+    gem 'simple_form', '2.0.0.rc'
 
 And then run:
 
@@ -116,7 +110,21 @@ And then run:
 
 Supported stylesheet engines:
 
-* LESS (recommended)
+* CSS
+* SCSS
+* LESS
+
+Make sure you have `sass-rails` dependency on your Gemfile:
+
+    gem 'sass-rails'
+
+And then run:
+
+    rails generate bootstrap:install --stylesheet-engine=scss
+
+Now you can [customize](http://decioferreira.github.com/bootstrap-generators/) the look and feel of Bootstrap.
+
+* LESS
 
 Add the dependency on your Gemfile:
 
@@ -124,22 +132,19 @@ Add the dependency on your Gemfile:
 
 And then run:
 
-    rails generate bootstrap:install --template-engine=haml
+    rails generate bootstrap:install --stylesheet-engine=less
 
-Now you can [customize][] the look and feel of Bootstrap.
-
-* CSS
-* SCSS
+Now you can [customize](http://decioferreira.github.com/bootstrap-generators/) the look and feel of Bootstrap.
 
 ## Assets
 
 <a name="customize"></a>
 
-### Customize and extend Bootstrap with LESS
+### Customize and extend Bootstrap
 
-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 or SCSS as your stylesheet engine, you will get an `app/assets/stylesheets/bootstrap-variables.css.[less|scss]` file with all of the [default variables](http://twitter.github.com/bootstrap/less.html#variables) of Bootstrap. This way you can [customize](http://decioferreira.github.com/bootstrap-generators/) the look and feel of Bootstrap without having to download any extra file:
 
-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:
+LESS version:
 
     // Variables to customize the look and feel of Bootstrap
     // -----------------------------------------------------
@@ -240,6 +245,107 @@ If you select LESS as your stylesheet engine, you will get an `app/assets/styles
     @fluidGridColumnWidth:    6.382978723%;
     @fluidGridGutterWidth:    2.127659574%;
 
+SCSS version:
+
+    // Variables.less
+    // Variables to customize the look and feel of Bootstrap
+    // -----------------------------------------------------
+
+
+
+    // GLOBAL VALUES
+    // --------------------------------------------------
+
+    // Links
+    $linkColor:             #08c !default;
+    $linkColorHover:        darken($linkColor, 15%) !default;
+
+    // Grays
+    $black:                 #000 !default;
+    $grayDarker:            #222 !default;
+    $grayDark:              #333 !default;
+    $gray:                  #555 !default;
+    $grayLight:             #999 !default;
+    $grayLighter:           #eee !default;
+    $white:                 #fff !default;
+
+    // Accent colors
+    $blue:                  #049cdb !default;
+    $blueDark:              #0064cd !default;
+    $green:                 #46a546 !default;
+    $red:                   #9d261d !default;
+    $yellow:                #ffc40d !default;
+    $orange:                #f89406 !default;
+    $pink:                  #c3325f !default;
+    $purple:                #7a43b6 !default;
+
+    // Typography
+    $baseFontSize:          13px !default;
+    $baseFontFamily:        "Helvetica Neue", Helvetica, Arial, sans-serif !default;
+    $baseLineHeight:        18px !default;
+    $textColor:             $grayDark !default;
+
+    // Buttons
+    $primaryButtonBackground:    $linkColor !default;
+
+
+
+    // 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 !default;
+
+    // Navbar
+    $navbarHeight:                    40px !default;
+    $navbarBackground:                $grayDarker !default;
+    $navbarBackgroundHighlight:       $grayDark !default;
+
+    $navbarText:                      $grayLight !default;
+    $navbarLinkColor:                 $grayLight !default;
+    $navbarLinkColorHover:            $white !default;
+
+    // Form states and alerts
+    $warningText:             #c09853 !default;
+    $warningBackground:       #fcf8e3 !default;
+    $warningBorder:           darken(adjust-hue($warningBackground, -10), 3%) !default;
+
+    $errorText:               #b94a48 !default;
+    $errorBackground:         #f2dede !default;
+    $errorBorder:             darken(adjust-hue($errorBackground, -10), 3%) !default;
+
+    $successText:             #468847 !default;
+    $successBackground:       #dff0d8 !default;
+    $successBorder:           darken(adjust-hue($successBackground, -10), 5%) !default;
+
+    $infoText:                #3a87ad !default;
+    $infoBackground:          #d9edf7 !default;
+    $infoBorder:              darken(adjust-hue($infoBackground, -10), 7%) !default;
+
+
+
+    // GRID
+    // --------------------------------------------------
+
+    // Default 940px grid
+    $gridColumns:             12 !default;
+    $gridColumnWidth:         60px !default;
+    $gridGutterWidth:         20px !default;
+    $gridRowWidth:            ($gridColumns * $gridColumnWidth) + ($gridGutterWidth * ($gridColumns - 1));
+
+    // Fluid grid
+    $fluidGridColumnWidth:    6.382978723% !default;
+    $fluidGridGutterWidth:    2.127659574% !default;
 
 ### Javascript
 

data/Rakefile

@@ -8,3 +8,62 @@ Rake::TestTask.new do |t|
 end
 
 task :default => :test
+
+desc "Converts LESS stylesheets to SCSS"
+task :less_to_scss do
+  Dir.glob('vendor/assets/stylesheets/less/*.less') do |less_file|
+    tree = []; level = 0
+    input_file = File.new(less_file, "r")
+
+    scss_file = File.basename(less_file, ".less")
+    output_file = File.new("vendor/assets/stylesheets/scss/#{scss_file}.scss", "w")
+
+    while(line = input_file.gets)
+      # IDs
+      if line.match(/^\s*#(\w+) {/)
+        tree.push(line.match(/^\s*#(\w+) {/)[1])
+      end
+
+      # Less extensions
+      line.gsub!(/\.less/, '')
+
+      # Level
+      if line.match(/{/)
+        level += 1
+      end
+
+      if line.match(/}/)
+        level -= 1
+        tree = tree.first(level)
+      end
+
+      # Variables
+      line.gsub!(/@(\w+)/) do |s|
+        ['@media', '@import', '@keyframes'].include?(s) ? s : s.gsub(/@(\w+)/, '$\1')
+      end
+
+      # Includes
+      line.gsub!(/(#(\w+) > )*\.(\S+\(.*\)\s*;)/) do |s|
+        s.gsub(/ > (#|\.)/, '-').gsub(/(#|\.)(.*;)/, '@include \2')
+      end
+
+      line.gsub!(/(#(\w+) > )+\.(\S+(\(.*\))?\s*;)/) do |s|
+        s.gsub(/ > (#|\.)/, '-').gsub(/(#|\.)(.*;)/, '@include \2')
+      end
+
+      # Mixins
+      line.gsub!(/\s*\.(\S+\(.*\)\s*{)/) do |s|
+        "@mixin #{[tree, s.match(/\.(\S+\(.*\)\s*{)/)[1]].flatten.join('-')}"
+      end
+
+      # Functions
+      line.gsub!(/spin\(/, 'adjust-hue(') # spin to adjust-hue
+      line.gsub!(/[:\( ]e\(([^\)]*)\)/, ' #{\1}')
+
+      output_file.puts line
+    end
+
+    input_file.close
+    output_file.close
+  end
+end

data/bootstrap-generators.gemspec

@@ -7,7 +7,7 @@ Gem::Specification.new do |s|
   s.version     = Bootstrap::Generators::VERSION
   s.authors     = ["Décio Ferreira"]
   s.email       = ["decio.ferreira@decioferreira.com"]
-  s.homepage    = "https://github.com/decioferreira/bootstrap-generators"
+  s.homepage    = "http://decioferreira.github.com/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. Checkout http://twitter.github.com/bootstrap.}
 

data/lib/bootstrap/generators/version.rb

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

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

@@ -38,6 +38,7 @@ module Bootstrap
           stylesheet_extension = 'css'
         else
           stylesheet_extension = "css.#{options[:stylesheet_engine]}"
+          copy_file "assets/stylesheets/bootstrap-variables.#{stylesheet_extension}", "app/assets/stylesheets/bootstrap-variables.#{stylesheet_extension}"
         end
 
         copy_file "assets/stylesheets/#{options[:layout]}.#{stylesheet_extension}", "app/assets/stylesheets/bootstrap-generators.#{stylesheet_extension}"

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

@@ -0,0 +1,98 @@
+// 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%;

data/lib/generators/bootstrap/install/templates/assets/stylesheets/bootstrap-variables.css.scss

@@ -0,0 +1,99 @@
+// Variables.less
+// Variables to customize the look and feel of Bootstrap
+// -----------------------------------------------------
+
+
+
+// GLOBAL VALUES
+// --------------------------------------------------
+
+// Links
+$linkColor:             #08c !default;
+$linkColorHover:        darken($linkColor, 15%) !default;
+
+// Grays
+$black:                 #000 !default;
+$grayDarker:            #222 !default;
+$grayDark:              #333 !default;
+$gray:                  #555 !default;
+$grayLight:             #999 !default;
+$grayLighter:           #eee !default;
+$white:                 #fff !default;
+
+// Accent colors
+$blue:                  #049cdb !default;
+$blueDark:              #0064cd !default;
+$green:                 #46a546 !default;
+$red:                   #9d261d !default;
+$yellow:                #ffc40d !default;
+$orange:                #f89406 !default;
+$pink:                  #c3325f !default;
+$purple:                #7a43b6 !default;
+
+// Typography
+$baseFontSize:          13px !default;
+$baseFontFamily:        "Helvetica Neue", Helvetica, Arial, sans-serif !default;
+$baseLineHeight:        18px !default;
+$textColor:             $grayDark !default;
+
+// Buttons
+$primaryButtonBackground:    $linkColor !default;
+
+
+
+// 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 !default;
+
+// Navbar
+$navbarHeight:                    40px !default;
+$navbarBackground:                $grayDarker !default;
+$navbarBackgroundHighlight:       $grayDark !default;
+
+$navbarText:                      $grayLight !default;
+$navbarLinkColor:                 $grayLight !default;
+$navbarLinkColorHover:            $white !default;
+
+// Form states and alerts
+$warningText:             #c09853 !default;
+$warningBackground:       #fcf8e3 !default;
+$warningBorder:           darken(adjust-hue($warningBackground, -10), 3%) !default;
+
+$errorText:               #b94a48 !default;
+$errorBackground:         #f2dede !default;
+$errorBorder:             darken(adjust-hue($errorBackground, -10), 3%) !default;
+
+$successText:             #468847 !default;
+$successBackground:       #dff0d8 !default;
+$successBorder:           darken(adjust-hue($successBackground, -10), 5%) !default;
+
+$infoText:                #3a87ad !default;
+$infoBackground:          #d9edf7 !default;
+$infoBorder:              darken(adjust-hue($infoBackground, -10), 7%) !default;
+
+
+
+// GRID
+// --------------------------------------------------
+
+// Default 940px grid
+$gridColumns:             12 !default;
+$gridColumnWidth:         60px !default;
+$gridGutterWidth:         20px !default;
+$gridRowWidth:            ($gridColumns * $gridColumnWidth) + ($gridGutterWidth * ($gridColumns - 1));
+
+// Fluid grid
+$fluidGridColumnWidth:    6.382978723% !default;
+$fluidGridGutterWidth:    2.127659574% !default;