resizing icon areas
authorIan Weller <ian@gaslightmedia.com>
Wed, 31 Aug 2016 19:17:06 +0000 (15:17 -0400)
committerIan Weller <ian@gaslightmedia.com>
Wed, 31 Aug 2016 19:17:06 +0000 (15:17 -0400)
resized the social icon areas to show trying to add position correctly.

css/app.css
scss/_page.footer.scss

index 3ef8d77..37edeb3 100644 (file)
@@ -7851,8 +7851,8 @@ footer.main {
         background-position: 0 0;
         margin-right: 7.5px; }
         footer.main .guide ul.social li.facebook a {
-          width: 70px;
-          height: 70px;
+          width: 71px;
+          height: 71px;
           display: block; }
         @media screen and (min-width: 1200px) {
           footer.main .guide ul.social li.facebook {
@@ -7870,8 +7870,8 @@ footer.main {
         background-position: -105px 0;
         margin: 0 7.5px; }
         footer.main .guide ul.social li.twit a {
-          width: 70px;
-          height: 70px;
+          width: 71px;
+          height: 71px;
           display: block; }
         @media screen and (min-width: 1200px) {
           footer.main .guide ul.social li.twit {
@@ -7886,11 +7886,11 @@ footer.main {
           footer.main .guide ul.social li.twit {
             margin: 0 5px; } }
       footer.main .guide ul.social li.blog {
-        background-position: -214px 0;
+        background-position: -212px 0;
         margin: 0 7.5px; }
         footer.main .guide ul.social li.blog a {
-          width: 70px;
-          height: 70px;
+          width: 71px;
+          height: 71px;
           display: block; }
         @media screen and (min-width: 1200px) {
           footer.main .guide ul.social li.blog {
@@ -7905,11 +7905,11 @@ footer.main {
           footer.main .guide ul.social li.blog {
             margin: 0 5px; } }
       footer.main .guide ul.social li.pin {
-        background-position: -318px 0;
+        background-position: -316px 0;
         margin: 0 7.5px; }
         footer.main .guide ul.social li.pin a {
-          width: 70px;
-          height: 70px;
+          width: 71px;
+          height: 71px;
           display: block; }
         @media screen and (min-width: 1200px) {
           footer.main .guide ul.social li.pin {
@@ -7924,11 +7924,11 @@ footer.main {
           footer.main .guide ul.social li.pin {
             margin: 0 5px; } }
       footer.main .guide ul.social li.tube {
-        background-position: -424px 0;
+        background-position: -422px 0;
         margin: 0 7.5px; }
         footer.main .guide ul.social li.tube a {
-          width: 70px;
-          height: 70px;
+          width: 71px;
+          height: 71px;
           display: block; }
         @media screen and (min-width: 1200px) {
           footer.main .guide ul.social li.tube {
@@ -7943,11 +7943,11 @@ footer.main {
           footer.main .guide ul.social li.tube {
             margin: 0 5px; } }
       footer.main .guide ul.social li.insta {
-        background-position: -530px 0;
+        background-position: -528px 0;
         margin-left: 7.5px; }
         footer.main .guide ul.social li.insta a {
-          width: 70px;
-          height: 70px;
+          width: 71px;
+          height: 71px;
           display: block; }
         @media screen and (min-width: 1200px) {
           footer.main .guide ul.social li.insta {
index c51a3a4..5fe802e 100644 (file)
@@ -63,8 +63,8 @@ footer.main {
                     background-position: 0 0;
                     margin-right: 7.5px;
                     a {
-                        width: 70px;
-                        height: 70px;
+                        width: 71px;
+                        height: 71px;
                         display: block;
                     }
                     @media screen and (min-width: 1200px){
@@ -85,8 +85,8 @@ footer.main {
                     background-position: -105px 0;
                     margin: 0 7.5px;
                     a {
-                        width: 70px;
-                        height: 70px;
+                        width: 71px;
+                        height: 71px;
                         display: block;
                     }
                     @media screen and (min-width: 1200px){
@@ -104,11 +104,11 @@ footer.main {
                     }
                 }
                 &.blog {
-                    background-position: -214px 0;
+                    background-position: -212px 0;
                     margin: 0 7.5px;
                     a {
-                        width: 70px;
-                        height: 70px;
+                        width: 71px;
+                        height: 71px;
                         display: block;
                     }
                     @media screen and (min-width: 1200px){
@@ -126,11 +126,11 @@ footer.main {
                     }
                 }
                 &.pin {
-                    background-position: -318px 0;
+                    background-position: -316px 0;
                     margin: 0 7.5px;
                     a {
-                        width: 70px;
-                        height: 70px;
+                        width: 71px;
+                        height: 71px;
                         display: block;
                     }
                     @media screen and (min-width: 1200px){
@@ -148,11 +148,11 @@ footer.main {
                     }
                 }
                 &.tube {
-                    background-position: -424px 0;
+                    background-position: -422px 0;
                     margin: 0 7.5px;
                     a {
-                        width: 70px;
-                        height: 70px;
+                        width: 71px;
+                        height: 71px;
                         display: block;
                     }
                     @media screen and (min-width: 1200px){
@@ -170,11 +170,11 @@ footer.main {
                     }
                 }
                 &.insta {
-                    background-position: -530px 0;
+                    background-position: -528px 0;
                     margin-left: 7.5px;
                     a {
-                        width: 70px;
-                        height: 70px;
+                        width: 71px;
+                        height: 71px;
                         display: block;
                     }
                     @media screen and (min-width: 1200px){