font_awesome-sass-rails 2.1.0 → 2.2.1

data/Changelog.txt

@@ -0,0 +1,9 @@
+## 2.2.1
+
+* Added `awesome_btn` helper, for nesting any tags such as multiple `awesome_icon` tags.
+
+## 2.2.0
+
+* Added ability to enhace class and add any html attributes on generated icon tag
+* Added `awesome_button` helper, that wraps the `awesome_icon` helper with an anchor tag. For use with Twitter Bootstrap (uses `btn` classes)
+

data/README.md

@@ -11,20 +11,22 @@ The full suite of pictographic icons, examples, and documentation can be found a
 
 Then `bundle` it!
 
-## Configuration
+## CSS Configuration
+
+In your CSS manifest file, fx `application.css`
 
 ```css
  *= require font-awesome
 ```
 
-On IE7
+For IE7
 
 ```css
  *= require font-awesome-ie
 ```
 
 The assets contains the `font-awesome` stylesheet in: LESS, SASS, SCSS and CSS.
-The fonts are available in `assets/fonts`. To load the font in a particular format, specify as one of the following:
+The fonts are available in `assets/fonts`. To load the font in a particular format, specify one of the following:
 
 ```css
  *= require font-awesome-sass
@@ -32,7 +34,6 @@ The fonts are available in `assets/fonts`. To load the font in a particular form
  *= require font-awesome-scss
 ```
 
-
 ## View helpers
 
 ```ruby
@@ -42,10 +43,80 @@ awesome_icon name, *args, &block
 Usage examples:
 
 ```ruby
-awesome_icon(:ok).should == "<i class=\"icon-ok\"></i>"
-awesome_icon(:ok, size: :large).should == "<i class=\"icon-ok icon-large\"></i>"
-awesome_icon(:ok, 'Okay :)').should == "<i class=\"icon-ok\"></i>Okay :)"
-awesome_icon(:ok) { 'Okay :)'}.should == "<i class=\"icon-ok\"></i>Okay :)"
+awesome_icon(:ok)
+
+# => <i class="icon-ok"></i>
+
+awesome_icon(:ok, size: :large)
+
+# => <i class="icon-ok icon-large"></i>
+
+awesome_icon(:ok, 'Okay :)')
+
+# => <i class="icon-ok"></i>Okay :)
+
+awesome_icon(:ok) { 'Okay :)'}
+
+# => "<i class="icon-ok"></i>Okay :)"
+
+awesome_icon(:ok, style: 'font-size: 10px', class: 'topleft')
+
+# => <i class="icon-ok topleft" style="font-size: 10px"></i>
+```
+
+Awesome button!
+
+```ruby
+awesome_button(:ok, size: 'large', type: 'primary', href: 'google.com') {'Okay :)'}
+
+# => <a class="btn  btn-large btn-primary" href="google.com"><i class="icon-ok icon-large"></i>Okay :)</a>
+```
+
+Awesome btn!
+
+```haml
+= awesome_btn :ok, size: 'large', type: 'primary', href: 'google.com'
+  = awesome_icon(:ok)
+  = awesome_icon(:plus, class: 'btn-overlay')
+  = 'Okay+'
+```
+
+# => <a class="btn  btn-large btn-primary" href="google.com"><i class="icon-ok"></i><i class="icon-plus btn-overlay"></i>Okay+</a>
+```
+
+## Composite icons using overlay effects
+
+Use something like the following CSS:
+
+```css
+.decorator.top {
+  font-size: 10px; 
+  position: relative; 
+  left: -0.6em; 
+  top: -0.6em;
+  color: orange;
+}
+```
+
+Then have the primary icon, followed by the icon to use for the overlay.
+
+```ruby
+= awesome_icon(:group)
+= awesome_icon(:plus, class:'decorator tl')
+```
+
+The second icon (plus) will be pushed half a character back (left) and up, to create a nice overlay effect - an "Add group" icon.
+
+## Troubleshooting
+
+If you get an error, saying that the asset (font-awesome) couldn't be found, try moving the gem statement outside any group.
+
+See http://stackoverflow.com/questions/9047478/rails-app-with-twitter-bootstrap-works-in-development-but-not-in-production and http://edgeguides.rubyonrails.org/asset_pipeline.html
+
+For hyphenated icon names, surround the icon name with quotes:
+
+```ruby
+awesome_icon(:'bookmark-empty').should == "<i class=\"icon-bookmark-empty\"></i>"
 ```
 
 ## Version

data/VERSION

@@ -1 +1 @@
-2.1.0
+2.2.1

data/font_awesome-sass-rails.gemspec

@@ -5,11 +5,11 @@
 
 Gem::Specification.new do |s|
   s.name = "font_awesome-sass-rails"
-  s.version = "2.1.0"
+  s.version = "2.2.1"
 
   s.required_rubygems_version = Gem::Requirement.new(">= 0") if s.respond_to? :required_rubygems_version=
   s.authors = ["Kristian Mandrup"]
-  s.date = "2012-10-11"
+  s.date = "2012-11-26"
   s.description = "Use Font Awesome in your Rails app :)"
   s.email = "kmandrup@gmail.com"
   s.extra_rdoc_files = [
@@ -19,6 +19,7 @@ Gem::Specification.new do |s|
   s.files = [
     ".document",
     ".rspec",
+    "Changelog.txt",
     "FontAwesomeMore-Vectors.pdf",
     "Gemfile",
     "Gemfile.lock",
@@ -42,8 +43,7 @@ Gem::Specification.new do |s|
     "vendor/assets/stylesheets/font-awesome-less.less.erb",
     "vendor/assets/stylesheets/font-awesome-sass.sass",
     "vendor/assets/stylesheets/font-awesome-scss.scss",
-    "vendor/assets/stylesheets/font-awesome.css.erb",
-    "vendor/assets/stylesheets/font-awesome.sass"
+    "vendor/assets/stylesheets/font-awesome.css.erb"
   ]
   s.homepage = "http://github.com/kristianmandrup/font_awesome-sass-rails"
   s.licenses = ["MIT"]

data/lib/font_awesome-sass/view_helper.rb

@@ -2,15 +2,48 @@ module FontAwesomeSass
   module ViewHelper
     def awesome_icon name, *args, &block
       options = args.extract_options!
-      size = options[:size] if options 
+      size = options.delete(:size) if options
       content = args.first unless args.blank?
       content ||= capture(&block) if block_given?
       content ||= ''
 
       clazz = "icon-#{name}"
       clazz << " icon-#{size}" if size.to_s == 'large'
+      clazz << " " << options.delete(:class) if options[:class]
 
-      content_tag(:i, nil, :class => clazz) + content.html_safe
+      content_tag(:i, nil, options.merge(:class => clazz)) + content.html_safe
+    end
+
+    def awesome_btn *args, &block
+      options = args.extract_options!
+      size = options[:size] if options[:size]
+      type = options.delete(:type) if options[:type]
+
+      clazz = "btn "
+      clazz << " btn-#{size}" if size
+      clazz << " btn-#{type}" if type && %w{primary}.include?(type.to_s)
+
+      href = options.delete(:href) || '#'
+
+      content_tag :a, {}.merge(class: clazz, href: href).merge(options[:btn] || {}) do
+        capture(&block)
+      end
+    end
+
+    def awesome_button name, *args, &block
+      options = args.extract_options!
+      size = options[:size] if options[:size]
+      type = options.delete(:type) if options[:type]
+
+      clazz = "btn "
+      clazz << " btn-#{size}" if size
+      clazz << " btn-#{type}" if type && %w{primary}.include?(type.to_s)
+
+      href = options.delete(:href) || '#'
+
+      content_tag :a, {}.merge(class: clazz, href: href).merge(options[:btn] || {}) do
+        awesome_icon name, options, &block
+      end
     end
   end
 end

data/spec/font_awesome_sass/view_helper_spec.rb

@@ -3,29 +3,68 @@ require 'spec_helper'
 describe FontAwesomeSass::ViewHelper do
   include ControllerTestHelpers,  
           FontAwesomeSass::ViewHelper
+  
+  describe 'awesome_icon' do          
+    describe ".awesome_icon :ok, 'Okay :)'" do
+      specify do
+        awesome_icon(:ok).should == "<i class=\"icon-ok\"></i>"
+      end
+    end
 
-  describe ".awesome_icon :ok, 'Okay :)'" do
-    specify do
-      awesome_icon(:ok).should == "<i class=\"icon-ok\"></i>"
+    describe ".awesome_icon :ok, 'Okay :)'" do
+      specify do
+        awesome_icon(:ok, size: :large).should == "<i class=\"icon-ok icon-large\"></i>"
+      end
     end
-  end
 
-  describe ".awesome_icon :ok, 'Okay :)'" do
-    specify do
-      awesome_icon(:ok, size: :large).should == "<i class=\"icon-ok icon-large\"></i>"
+    describe ".awesome_icon :ok, style: 'font-size: 10px'" do
+      specify do
+        awesome_icon(:ok, style: 'font-size: 10px').should == "<i class=\"icon-ok\" style=\"font-size: 10px\"></i>"
+      end
     end
-  end
 
-  # <i class="icon-ok"></i>Okay :)
-  describe ".awesome_icon :ok, 'Okay :)'" do
-    specify do
-      awesome_icon(:ok, 'Okay :)').should == "<i class=\"icon-ok\"></i>Okay :)"
+    describe ".awesome_icon :ok, class: 'topleft'" do
+      specify do
+        awesome_icon(:ok, class: 'topleft').should == "<i class=\"icon-ok topleft\"></i>"
+      end
+    end
+
+    describe ".awesome_icon :ok, style: 'font-size: 10px', class: 'topleft'" do
+      specify do
+        awesome_icon(:ok, style: 'font-size: 10px', class: 'topleft').should == "<i class=\"icon-ok topleft\" style=\"font-size: 10px\"></i>"
+      end
+    end
+
+
+    # <i class="icon-ok"></i>Okay :)
+    describe ".awesome_icon :ok, 'Okay :)'" do
+      specify do
+        awesome_icon(:ok, 'Okay :)').should == "<i class=\"icon-ok\"></i>Okay :)"
+      end
+    end
+
+    describe ".awesome_icon(:ok) {'Okay :)'}" do
+      specify do
+        awesome_icon(:ok) { 'Okay :)'}.should == "<i class=\"icon-ok\"></i>Okay :)"
+      end
     end
   end
 
-  describe ".awesome_icon(:ok) {'Okay :)'}" do
+  describe 'awesome_btn' do
     specify do
-      awesome_icon(:ok) { 'Okay :)'}.should == "<i class=\"icon-ok\"></i>Okay :)"
+      res = awesome_btn(:ok, size: 'large', type: 'primary', href: 'google.com') do
+        awesome_icon(:ok) + awesome_icon(:plus)
+      end
+      res.should == "<a class=\"btn  btn-large btn-primary\" href=\"google.com\"><i class=\"icon-ok\"></i><i class=\"icon-plus\"></i></a>"
     end
   end
+  
+  describe 'awesome_button' do
+    describe ".awesome_button(:ok, size: 'large', type: 'primary', href: 'google.com') {'Okay :)'}" do
+      specify do
+        res = awesome_button(:ok, size: 'large', type: 'primary', href: 'google.com') {'Okay :)'}
+        res.should == "<a class=\"btn  btn-large btn-primary\" href=\"google.com\"><i class=\"icon-ok icon-large\"></i>Okay :)</a>"
+      end
+    end    
+  end 
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: font_awesome-sass-rails
 version: !ruby/object:Gem::Version
-  version: 2.1.0
+  version: 2.2.1
   prerelease: 
 platform: ruby
 authors:
@@ -9,7 +9,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2012-10-11 00:00:00.000000000 Z
+date: 2012-11-26 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -149,6 +149,7 @@ extra_rdoc_files:
 files:
 - .document
 - .rspec
+- Changelog.txt
 - FontAwesomeMore-Vectors.pdf
 - Gemfile
 - Gemfile.lock
@@ -173,7 +174,6 @@ files:
 - vendor/assets/stylesheets/font-awesome-sass.sass
 - vendor/assets/stylesheets/font-awesome-scss.scss
 - vendor/assets/stylesheets/font-awesome.css.erb
-- vendor/assets/stylesheets/font-awesome.sass
 homepage: http://github.com/kristianmandrup/font_awesome-sass-rails
 licenses:
 - MIT
@@ -189,7 +189,7 @@ required_ruby_version: !ruby/object:Gem::Requirement
       version: '0'
       segments:
       - 0
-      hash: 4306389019651255960
+      hash: 4348156922474268699
 required_rubygems_version: !ruby/object:Gem::Requirement
   none: false
   requirements:

data/vendor/assets/stylesheets/font-awesome.sass

@@ -1,846 +0,0 @@
-/*  Font Awesome
- *    the iconic font designed for use with Twitter Bootstrap
- *    -------------------------------------------------------
- *    The full suite of pictographic icons, examples, and documentation
- *    can be found at: http://fortawesome.github.com/Font-Awesome/
- *
- *    License
- *    -------------------------------------------------------
- *    The Font Awesome webfont, CSS, and LESS files are licensed under CC BY 3.0:
- *    http://creativecommons.org/licenses/by/3.0/ A mention of
- *    'Font Awesome - http://fortawesome.github.com/Font-Awesome' in human-readable
- *    source code is considered acceptable attribution (most common on the web).
- *    If human readable source code is not available to the end user, a mention in
- *    an 'About' or 'Credits' screen is considered acceptable (most common in desktop
- *    or mobile software).
- *
- *    Contact
- *    -------------------------------------------------------
- *    Email: dave@davegandy.com
- *    Twitter: http://twitter.com/fortaweso_me
- *    Work: Lead Product Designer @ http://kyruus.com
- *
- *    Using asset_path (sass)
-
-@import compass/css3/font-face
-
-$font_path: asset-path("fontawesome-webfont", font) !default
-
-+font-face("FontAwesome", font-files("#{$font_path}.woff", woff, "#{$font_path}.ttf", truetype, "#{$font_path}.otf", opentype, "#{$font_path}.svgz#FontAwesomeRegular", svg, "#{$font_path}.svg#FontAwesomeRegular", svg), "#{$font_path}.eot", normal, normal)
-
-/*  Font Awesome styles
- *  -------------------------------------------------------
-
-[class^="icon-"]:before,
-[class*=" icon-"]:before
-  font-family: FontAwesome
-  font-weight: normal
-  font-style: normal
-  display: inline-block
-  text-decoration: inherit
-
-a [class^="icon-"],
-a [class*=" icon-"]
-  display: inline-block
-  text-decoration: inherit
-
-/* makes the font 33% larger relative to the icon container
-.icon-large:before
-  vertical-align: middle
-  font-size: 4 / 3em
-
-.btn, .nav-tabs
-  [class^="icon-"],
-  [class*=" icon-"]
-    /* keeps button heights with and without icons the same
-    line-height: .9em
-
-li
-  [class^="icon-"],
-  [class*=" icon-"]
-    display: inline-block
-    width: 1.25em
-    text-align: center
-  .icon-large:before,
-  .icon-large:before
-    /* 1.5 increased font size for icon-large * 1.25 width
-    width: 1.5 * 1.25em
-
-ul.icons
-  list-style-type: none
-  margin-left: 2em
-  text-indent: -0.8em
-  li
-    [class^="icon-"],
-    [class*=" icon-"]
-      width: .8em
-    .icon-large:before,
-    .icon-large:before
-      /* 1.5 increased font size for icon-large * 1.25 width
-      vertical-align: initial
-      //      width: 1.5*1.25em;
-
-/*  Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
- *  readers do not read off random characters that represent icons
-.icon-glass:before
-  content: "\f000"
-
-.icon-music:before
-  content: "\f001"
-
-.icon-search:before
-  content: "\f002"
-
-.icon-envelope:before
-  content: "\f003"
-
-.icon-heart:before
-  content: "\f004"
-
-.icon-star:before
-  content: "\f005"
-
-.icon-star-empty:before
-  content: "\f006"
-
-.icon-user:before
-  content: "\f007"
-
-.icon-film:before
-  content: "\f008"
-
-.icon-th-large:before
-  content: "\f009"
-
-.icon-th:before
-  content: "\f00a"
-
-.icon-th-list:before
-  content: "\f00b"
-
-.icon-ok:before
-  content: "\f00c"
-
-.icon-remove:before
-  content: "\f00d"
-
-.icon-zoom-in:before
-  content: "\f00e"
-
-.icon-zoom-out:before
-  content: "\f010"
-
-.icon-off:before
-  content: "\f011"
-
-.icon-signal:before
-  content: "\f012"
-
-.icon-cog:before
-  content: "\f013"
-
-.icon-trash:before
-  content: "\f014"
-
-.icon-home:before
-  content: "\f015"
-
-.icon-file:before
-  content: "\f016"
-
-.icon-time:before
-  content: "\f017"
-
-.icon-road:before
-  content: "\f018"
-
-.icon-download-alt:before
-  content: "\f019"
-
-.icon-download:before
-  content: "\f01a"
-
-.icon-upload:before
-  content: "\f01b"
-
-.icon-inbox:before
-  content: "\f01c"
-
-.icon-play-circle:before
-  content: "\f01d"
-
-.icon-repeat:before
-  content: "\f01e"
-
-/* \f020 is not a valid unicode character. all shifted one down
-.icon-refresh:before
-  content: "\f021"
-
-.icon-list-alt:before
-  content: "\f022"
-
-.icon-lock:before
-  content: "\f023"
-
-.icon-flag:before
-  content: "\f024"
-
-.icon-headphones:before
-  content: "\f025"
-
-.icon-volume-off:before
-  content: "\f026"
-
-.icon-volume-down:before
-  content: "\f027"
-
-.icon-volume-up:before
-  content: "\f028"
-
-.icon-qrcode:before
-  content: "\f029"
-
-.icon-barcode:before
-  content: "\f02a"
-
-.icon-tag:before
-  content: "\f02b"
-
-.icon-tags:before
-  content: "\f02c"
-
-.icon-book:before
-  content: "\f02d"
-
-.icon-bookmark:before
-  content: "\f02e"
-
-.icon-print:before
-  content: "\f02f"
-
-.icon-camera:before
-  content: "\f030"
-
-.icon-font:before
-  content: "\f031"
-
-.icon-bold:before
-  content: "\f032"
-
-.icon-italic:before
-  content: "\f033"
-
-.icon-text-height:before
-  content: "\f034"
-
-.icon-text-width:before
-  content: "\f035"
-
-.icon-align-left:before
-  content: "\f036"
-
-.icon-align-center:before
-  content: "\f037"
-
-.icon-align-right:before
-  content: "\f038"
-
-.icon-align-justify:before
-  content: "\f039"
-
-.icon-list:before
-  content: "\f03a"
-
-.icon-indent-left:before
-  content: "\f03b"
-
-.icon-indent-right:before
-  content: "\f03c"
-
-.icon-facetime-video:before
-  content: "\f03d"
-
-.icon-picture:before
-  content: "\f03e"
-
-.icon-pencil:before
-  content: "\f040"
-
-.icon-map-marker:before
-  content: "\f041"
-
-.icon-adjust:before
-  content: "\f042"
-
-.icon-tint:before
-  content: "\f043"
-
-.icon-edit:before
-  content: "\f044"
-
-.icon-share:before
-  content: "\f045"
-
-.icon-check:before
-  content: "\f046"
-
-.icon-move:before
-  content: "\f047"
-
-.icon-step-backward:before
-  content: "\f048"
-
-.icon-fast-backward:before
-  content: "\f049"
-
-.icon-backward:before
-  content: "\f04a"
-
-.icon-play:before
-  content: "\f04b"
-
-.icon-pause:before
-  content: "\f04c"
-
-.icon-stop:before
-  content: "\f04d"
-
-.icon-forward:before
-  content: "\f04e"
-
-.icon-fast-forward:before
-  content: "\f050"
-
-.icon-step-forward:before
-  content: "\f051"
-
-.icon-eject:before
-  content: "\f052"
-
-.icon-chevron-left:before
-  content: "\f053"
-
-.icon-chevron-right:before
-  content: "\f054"
-
-.icon-plus-sign:before
-  content: "\f055"
-
-.icon-minus-sign:before
-  content: "\f056"
-
-.icon-remove-sign:before
-  content: "\f057"
-
-.icon-ok-sign:before
-  content: "\f058"
-
-.icon-question-sign:before
-  content: "\f059"
-
-.icon-info-sign:before
-  content: "\f05a"
-
-.icon-screenshot:before
-  content: "\f05b"
-
-.icon-remove-circle:before
-  content: "\f05c"
-
-.icon-ok-circle:before
-  content: "\f05d"
-
-.icon-ban-circle:before
-  content: "\f05e"
-
-.icon-arrow-left:before
-  content: "\f060"
-
-.icon-arrow-right:before
-  content: "\f061"
-
-.icon-arrow-up:before
-  content: "\f062"
-
-.icon-arrow-down:before
-  content: "\f063"
-
-.icon-share-alt:before
-  content: "\f064"
-
-.icon-resize-full:before
-  content: "\f065"
-
-.icon-resize-small:before
-  content: "\f066"
-
-.icon-plus:before
-  content: "\f067"
-
-.icon-minus:before
-  content: "\f068"
-
-.icon-asterisk:before
-  content: "\f069"
-
-.icon-exclamation-sign:before
-  content: "\f06a"
-
-.icon-gift:before
-  content: "\f06b"
-
-.icon-leaf:before
-  content: "\f06c"
-
-.icon-fire:before
-  content: "\f06d"
-
-.icon-eye-open:before
-  content: "\f06e"
-
-.icon-eye-close:before
-  content: "\f070"
-
-.icon-warning-sign:before
-  content: "\f071"
-
-.icon-plane:before
-  content: "\f072"
-
-.icon-calendar:before
-  content: "\f073"
-
-.icon-random:before
-  content: "\f074"
-
-.icon-comment:before
-  content: "\f075"
-
-.icon-magnet:before
-  content: "\f076"
-
-.icon-chevron-up:before
-  content: "\f077"
-
-.icon-chevron-down:before
-  content: "\f078"
-
-.icon-retweet:before
-  content: "\f079"
-
-.icon-shopping-cart:before
-  content: "\f07a"
-
-.icon-folder-close:before
-  content: "\f07b"
-
-.icon-folder-open:before
-  content: "\f07c"
-
-.icon-resize-vertical:before
-  content: "\f07d"
-
-.icon-resize-horizontal:before
-  content: "\f07e"
-
-.icon-bar-chart:before
-  content: "\f080"
-
-.icon-twitter-sign:before
-  content: "\f081"
-
-.icon-facebook-sign:before
-  content: "\f082"
-
-.icon-camera-retro:before
-  content: "\f083"
-
-.icon-key:before
-  content: "\f084"
-
-.icon-cogs:before
-  content: "\f085"
-
-.icon-comments:before
-  content: "\f086"
-
-.icon-thumbs-up:before
-  content: "\f087"
-
-.icon-thumbs-down:before
-  content: "\f088"
-
-.icon-star-half:before
-  content: "\f089"
-
-.icon-heart-empty:before
-  content: "\f08a"
-
-.icon-signout:before
-  content: "\f08b"
-
-.icon-linkedin-sign:before
-  content: "\f08c"
-
-.icon-pushpin:before
-  content: "\f08d"
-
-.icon-external-link:before
-  content: "\f08e"
-
-.icon-signin:before
-  content: "\f090"
-
-.icon-trophy:before
-  content: "\f091"
-
-.icon-github-sign:before
-  content: "\f092"
-
-.icon-upload-alt:before
-  content: "\f093"
-
-.icon-lemon:before
-  content: "\f094"
-
-.icon-phone:before
-  content: "\f095"
-
-.icon-check-empty:before
-  content: "\f096"
-
-.icon-bookmark-empty:before
-  content: "\f097"
-
-.icon-phone-sign:before
-  content: "\f098"
-
-.icon-twitter:before
-  content: "\f099"
-
-.icon-facebook:before
-  content: "\f09a"
-
-.icon-github:before
-  content: "\f09b"
-
-.icon-unlock:before
-  content: "\f09c"
-
-.icon-credit-card:before
-  content: "\f09d"
-
-.icon-rss:before
-  content: "\f09e"
-
-.icon-hdd:before
-  content: "\f0a0"
-
-.icon-bullhorn:before
-  content: "\f0a1"
-
-.icon-bell:before
-  content: "\f0a2"
-
-.icon-certificate:before
-  content: "\f0a3"
-
-.icon-hand-right:before
-  content: "\f0a4"
-
-.icon-hand-left:before
-  content: "\f0a5"
-
-.icon-hand-up:before
-  content: "\f0a6"
-
-.icon-hand-down:before
-  content: "\f0a7"
-
-.icon-circle-arrow-left:before
-  content: "\f0a8"
-
-.icon-circle-arrow-right:before
-  content: "\f0a9"
-
-.icon-circle-arrow-up:before
-  content: "\f0aa"
-
-.icon-circle-arrow-down:before
-  content: "\f0ab"
-
-.icon-globe:before
-  content: "\f0ac"
-
-.icon-wrench:before
-  content: "\f0ad"
-
-.icon-tasks:before
-  content: "\f0ae"
-
-.icon-filter:before
-  content: "\f0b0"
-
-.icon-briefcase:before
-  content: "\f0b1"
-
-.icon-fullscreen:before
-  content: "\f0b2"
-
-.icon-group:before
-  content: "\f0c0"
-
-.icon-link:before
-  content: "\f0c1"
-
-.icon-cloud:before
-  content: "\f0c2"
-
-.icon-beaker:before
-  content: "\f0c3"
-
-.icon-cut:before
-  content: "\f0c4"
-
-.icon-copy:before
-  content: "\f0c5"
-
-.icon-paper-clip:before
-  content: "\f0c6"
-
-.icon-save:before
-  content: "\f0c7"
-
-.icon-sign-blank:before
-  content: "\f0c8"
-
-.icon-reorder:before
-  content: "\f0c9"
-
-.icon-list-ul:before
-  content: "\f0ca"
-
-.icon-list-ol:before
-  content: "\f0cb"
-
-.icon-strikethrough:before
-  content: "\f0cc"
-
-.icon-underline:before
-  content: "\f0cd"
-
-.icon-table:before
-  content: "\f0ce"
-
-.icon-magic:before
-  content: "\f0d0"
-
-.icon-truck:before
-  content: "\f0d1"
-
-.icon-pinterest:before
-  content: "\f0d2"
-
-.icon-pinterest-sign:before
-  content: "\f0d3"
-
-.icon-google-plus-sign:before
-  content: "\f0d4"
-
-.icon-google-plus:before
-  content: "\f0d5"
-
-.icon-money:before
-  content: "\f0d6"
-
-.icon-caret-down:before
-  content: "\f0d7"
-
-.icon-caret-up:before
-  content: "\f0d8"
-
-.icon-caret-left:before
-  content: "\f0d9"
-
-.icon-caret-right:before
-  content: "\f0da"
-
-.icon-columns:before
-  content: "\f0db"
-
-.icon-sort:before
-  content: "\f0dc"
-
-.icon-sort-down:before
-  content: "\f0dd"
-
-.icon-sort-up:before
-  content: "\f0de"
-
-.icon-envelope-alt:before
-  content: "\f0e0"
-
-.icon-linkedin:before
-  content: "\f0e1"
-
-.icon-undo:before
-  content: "\f0e2"
-
-.icon-legal:before
-  content: "\f0e3"
-
-.icon-dashboard:before
-  content: "\f0e4"
-
-.icon-comment-alt:before
-  content: "\f0e5"
-
-.icon-comments-alt:before
-  content: "\f0e6"
-
-.icon-bolt:before
-  content: "\f0e7"
-
-.icon-sitemap:before
-  content: "\f0e8"
-
-.icon-umbrella:before
-  content: "\f0e9"
-
-.icon-paste:before
-  content: "\f0ea"
-
-.icon-user-md:before
-  content: "\f200"
-  
-.icon-apple-logo:before
-  content: "\f500"
-  
-.icon-windows-8:before
-  content: "\f501"
-  
-.icon-js-fiddle:before
-  content: "\f502"
-  
-.icon-skype:before
-  content: "\f503"
-
-.icon-youtube-sign:before
-  content: "\f504"
-
-.icon-youtube:before
-  content: "\f505"
-
-.icon-vimeo-sign:before
-  content: "\f506"
-
-.icon-vimeo:before
-  content: "\f507"
-
-.icon-lastfm-sign:before
-  content: "\f508"
-
-.icon-lastfm:before
-  content: "\f509"
-
-.icon-rss-sign:before
-  content: "\f50a"
-  
-.icon-reddit:before
-  content: "\f50b"
-
-.icon-delicious-sign:before
-  content: "\f50c"
-
-.icon-wordpress-sign:before
-  content: "\f50d"
-
-.icon-wordpress:before
-  content: "\f50e"
-
-.icon-git-fork:before
-  content: "\f50f"
-
-.icon-blogger-sign:before
-  content: "\f510"
-
-.icon-blogger:before
-  content: "\f511"
-
-.icon-tumblr-sign:before
-  content: "\f512"
-
-.icon-tumblr:before
-  content: "\f513"
-
-.icon-flickr-sign:before
-  content: "\f514"
-
-.icon-flickr:before
-  content: "\f515"
-
-.icon-picasa-sign:before
-  content: "\f516"
-
-.icon-picasa:before
-  content: "\f517"
-
-.icon-amazon-sign:before
-  content: "\f518"
-
-.icon-amazon:before
-  content: "\f519"
-
-.icon-yelp-sign:before
-  content: "\f51a"
-
-.icon-yelp:before
-  content: "\f51b"
-
-.icon-soundcloud:before
-  content: "\f51c"
-
-.icon-spotify:before
-  content: "\f51d"
-
-.icon-yahoo-sign:before
-  content: "\f520"
-
-.icon-yahoo:before
-  content: "\f521"
-
-.icon-evernote-sign:before
-  content: "\f522"
-
-.icon-evernote:before
-  content: "\f523"
-
-.icon-google-sign:before
-  content: "\f524"
-
-.icon-google:before
-  content: "\f525"
-
-.icon-hacker-news:before
-  content: "\f526"
-
-.icon-map:before
-  content: "\f529"
-
-.icon-bus-sign:before
-  content: "\f52a"
-
-.icon-bike-sign:before
-  content: "\f52b"
-
-.icon-car-sign:before
-  content: "\f52c"
-
-.icon-taxi-sign:before
-  content: "\f52d"
-
-.icon-truck-sign:before
-  content: "\f52e"
-
-.icon-handicap-sign:before
-  content: "\f52f"