Merge pull request #35 from bigbitecreative/hotfix/social-icons

Adds fix for social icons missing
bigbite · Dec 11, 2018 · c153c1d · c153c1d
2 parents b18b7c5 + 811dcdf
commit c153c1d
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 12 deletions.
diff --git a/src/styles/components/_social.scss b/src/styles/components/_social.scss
@@ -9,14 +9,16 @@
   width: 20px;
   height: 20px;
   color: transparent;
-  visibility: hidden;
 }
 
 .social-facebook::after,
 .social-google::after,
 .social-instagram::after,
 .social-twitter::after,
 .social-youtube::after {
+  position: absolute;
+  top: calc(50% - 14px);
+  left: calc(50% - 14px);
   content: "";
   width: 20px;
   height: 20px;
@@ -26,21 +28,21 @@
 }
 
 .social-facebook::after {
-  @include icon_svg(20px, 20px, "black", "facebook");
+  @include icon_svg(20px, 20px, "white", "facebook");
 }
 
 .social-google::after {
-  @include icon_svg(20px, 20px, "black", "google");
+  @include icon_svg(20px, 20px, "white", "google");
 }
 
 .social-instagram::after {
-  @include icon_svg(20px, 20px, "black", "instagram");
+  @include icon_svg(20px, 20px, "white", "instagram");
 }
 
 .social-twitter::after {
-  @include icon_svg(20px, 20px, "black", "twitter");
+  @include icon_svg(20px, 20px, "white", "twitter");
 }
 
 .social-youtube::after {
-  @include icon_svg(20px, 20px, "black", "youtube");
+  @include icon_svg(20px, 20px, "white", "youtube");
 }
diff --git a/src/styles/layout/_page-foot.scss b/src/styles/layout/_page-foot.scss
@@ -263,7 +263,7 @@
   flex-wrap: wrap;
   justify-content: center;
   margin: 0;
-  margin-left: 18px;
+  margin-left: 10px;
   list-style: none;
 
   .rtl & {
@@ -273,12 +273,13 @@
 }
 
 .page-footerSocial a {
-  @include state-background(lighten($color-black, 20%));
   display: block;
+
+  &:hover {
+    text-decoration: none;
+  }
 }
 
-.page-footerSocial a span {
-  padding: 10px;
-  width: 40px;
-  height: 40px;
+.page-footerSocial a {
+  margin: 0 5px;
 }