Using Foundation Icon Fonts 3. Cleaned up stylesheet organization.

_assets/stylesheets/_settings.sass

@@ -21,6 +21,8 @@
 // This is the default html and body font-size for the base rem value.
 $rem-base: 16px
 
+@import "variables"
+
 // We use this to control whether or not CSS classes come through in the gem files.
 // $include-html-classes: true
 // $include-print-styles: true

_assets/stylesheets/_style.sass

@@ -38,6 +38,8 @@ a
 
 #external
   display: inline-block
+  a.icon
+    font-size: 1.3em
   ul
     +inline-list
 
@@ -58,7 +60,6 @@ $cv_first_column_padding: 30px
       color: #FFF
       font-weight: bold
       +simple_bullets( $pdf_icon, $pdf_icon_padding )
-      background-size: contain
       &:after
         content: " :"
 

_assets/stylesheets/_variables.sass

@@ -0,0 +1,33 @@
+//
+// Custom mixins
+//
+
+=simple_bullets($img, $padding)
+  background-image: url(asset_path($img))
+  background-repeat: no-repeat
+  background-position: left center
+  background-size: contain
+  padding-left: $padding
+
+//
+// Colors
+//
+
+// Web
+$clr_qwhite: #EEEEEE
+$clr_sky_eyes: #D0EFF1
+$clr_waves: #79BCC4
+$clr_laughs_and: #3CB8AE
+$clr_blue_green: #467D91
+
+// Fonts
+@import "compass/css3/font-face"
++font-face( "CMUBright-Roman", url( 'fonts/cmunbmr.otf' ) )
+
+// vars
+$banner_height: 100px
+$site_title_font: "CMUBright-Roman", sans-serf
+$site_title_clr: white
+$site_title_font_weight: normal
+$pdf_icon: "icon-pdf.svg"
+$pdf_icon_padding: 25px

_assets/stylesheets/app.css.sass.erb

@@ -4,46 +4,18 @@
 // Make sure the charset is set appropriately
 @charset "UTF-8"
 
+// Foundation Icon Fonts 3
+@import "foundation-icons"
+
+// Compass
 @import "compass/typography/lists/horizontal-list"
 @import "compass/typography/lists/bullets"
 
-// Custom mixins
-
-=simple_bullets( $img, $padding )
-  background-image: $img
-  background-repeat: no-repeat
-  background-position: left center
-  padding-left: $padding
-
-// Assets, e.g. fonts, colors, images
-
-//
-// Colors
-//
-
-// Web
-$clr_qwhite: #EEEEEE
-$clr_sky_eyes: #D0EFF1
-$clr_waves: #79BCC4
-$clr_laughs_and: #3CB8AE
-$clr_blue_green: #467D91
-
-// Fonts
-@import "compass/css3/font-face"
-+font-face( "CMUBright-Roman", url( 'fonts/cmunbmr.otf' ) )
-
-// vars
-$banner_height: 100px
-$site_title_font: "CMUBright-Roman", sans-serf
-$site_title_clr: white
-$site_title_font_weight: normal
-$pdf_icon: url(asset_path('icon-pdf.svg'))
-$pdf_icon_padding: 25px
-
 // Global Foundation Settings
 @import "settings"
 
 // Import Foundation
 @import "foundation/scss/foundation"
 
+// Site styles
 @import "style"

_config.dev.yml

@@ -2,7 +2,7 @@ domain: null
 
 assets:
   baseurl: /assets/
-  cachebust: none
+  cachebust: hard
   cache: true
   compress:
     css: null

_data/external_links.yml

@@ -1,19 +1,15 @@
 - name: GitHub
   url: https://github.com/razor-x
-  image: github.com.png
-
-- name: RubyGems.org
-  url: https://rubygems.org/profiles/49715
-  image: rubygems.org.png
+  icon: fi-social-github
 
 - name: Google+
   url: https://plus.google.com/118056675600044327520/
-  image: plus.google.com.png
+  icon: fi-social-google-plus
 
 - name: Facebook
   url: https://www.facebook.com/evan.sosenko
-  image: www.facebook.com.png
+  icon: fi-social-facebook
 
 - name: Twitter
   url: https://twitter.com/ThatsMr_n00b_2u
-  image: twitter.com.png
+  icon: fi-social-twitter

_layouts/default.html

@@ -19,7 +19,7 @@ <h1 id="banner"><a id="title" href="{{ site.domain }}/">Evan <span></span> Sosen
     <nav id="external">
       <ul>
       {% for item in site.data.external_links %}
-        <li><a href="{{ item.url }}"><img src="{{ item.image | asset_path }}" width="16" height="16" alt="{{ item.name }}" /></a></li>
+        <li><a class="icon {{ item.icon }}" href="{{ item.url }}"></a></li>
       {% endfor %}
         <li><a href="" data-reveal-id="email_modal">@</a></li>
         <li><a href="{{ site.domain }}/cv/">CV</a></li>

bower.json

@@ -2,6 +2,7 @@
   "name": "Jekyll & ZURB",
   "version": "1.0.0",
   "dependencies": {
+    "foundation-icon-fonts": "latest",
     "normalize-css": "2.1.3",
     "jquery": "2.0.3",
     "foundation": "5.0.2"