From 34ad723d9b2d9a00b1a05637fff1320690d5c7e0 Mon Sep 17 00:00:00 2001
From: Ian Jennings <ian.jennings@datuhealth.com>
Date: Thu, 7 Nov 2013 01:12:32 -0700
Subject: [PATCH] the glory.. and majesty.. of compass sprites.

Signed-off-by: Ian Jennings <ian.jennings@datuhealth.com>
---
 app/images/{ => icons}/facebook-16.png | Bin
 app/images/{ => icons}/facebook-24.png | Bin
 app/images/{ => icons}/twitter-16.png  | Bin
 app/images/{ => icons}/twitter-24.png  | Bin
 app/styles/login.scss                  |   6 ++++--
 app/styles/main.scss                   |  16 ++++++++++------
 6 files changed, 14 insertions(+), 8 deletions(-)
 rename app/images/{ => icons}/facebook-16.png (100%)
 rename app/images/{ => icons}/facebook-24.png (100%)
 rename app/images/{ => icons}/twitter-16.png (100%)
 rename app/images/{ => icons}/twitter-24.png (100%)

diff --git a/app/images/facebook-16.png b/app/images/icons/facebook-16.png
similarity index 100%
rename from app/images/facebook-16.png
rename to app/images/icons/facebook-16.png
diff --git a/app/images/facebook-24.png b/app/images/icons/facebook-24.png
similarity index 100%
rename from app/images/facebook-24.png
rename to app/images/icons/facebook-24.png
diff --git a/app/images/twitter-16.png b/app/images/icons/twitter-16.png
similarity index 100%
rename from app/images/twitter-16.png
rename to app/images/icons/twitter-16.png
diff --git a/app/images/twitter-24.png b/app/images/icons/twitter-24.png
similarity index 100%
rename from app/images/twitter-24.png
rename to app/images/icons/twitter-24.png
diff --git a/app/styles/login.scss b/app/styles/login.scss
index 154ea03..bd381cb 100644
--- a/app/styles/login.scss
+++ b/app/styles/login.scss
@@ -54,7 +54,8 @@
             background:#3b5998;
 
             .icon{
-                background-image:url(../images/facebook-24.png);
+                @extend .icons-facebook-24;
+                @include sprite-background-position($icons-sprites, facebook-24, 5px, 6px);
             }
         }
 
@@ -62,7 +63,8 @@
             background:#00acee;
 
             .icon{
-                background-image:url(../images/twitter-24.png);
+                @extend .icons-twitter-24;
+                @include sprite-background-position($icons-sprites, twitter-24, 6px, 5px);
             }
         }
     }
diff --git a/app/styles/main.scss b/app/styles/main.scss
index e0c0f69..2261e22 100644
--- a/app/styles/main.scss
+++ b/app/styles/main.scss
@@ -11,9 +11,12 @@ $almostWhite: rgba($black,.04);
 @import 'compass';
 @import 'responsive';
 @import 'mixins/triangle';
-@import 'login';
 
+$icons-spacing: 20px;
+@import '../images/icons/*.png';
+@include all-icons-sprites;
 
+@import 'login';
 
 
 $green: green;
@@ -78,16 +81,17 @@ button {
         width:16px;
         height:16px;
         background-repeat:no-repeat;
-        margin-left:3px;
+        margin: 0 0 0 3px;
+
 
         &.icon-tw-white{
-            background-image:url(../images/twitter-16.png);
-            background-position:0px 2px;
+            @extend .icons-twitter-16;
+            @include sprite-background-position($icons-sprites, twitter-16, 0, 2px);
         }
 
         &.icon-fb-white{
-            background-image:url(../images/facebook-16.png);
-            background-position:0px 1px;
+            @extend .icons-facebook-16;
+            @include sprite-background-position($icons-sprites, facebook-16, 0, 1px);
         }
     }
 }