removes deprecated SCSS selectors

fixes #56
rohanchandra · Sep 3, 2017 · 4b5ca61 · 4b5ca61
1 parent 8afb9e7
commit 4b5ca61
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 18 deletions.
diff --git a/_sass/base/_utility.scss b/_sass/base/_utility.scss
@@ -11,10 +11,6 @@
     padding: $padding-small * 1.5 $padding-large / 1.6;
   }
 }
-%link-hover {
-  text-decoration: underline;
-  color: darken($link-color, 15%);
-}
 // Buttons
 .button {
   border-radius: 0.3em;
@@ -23,11 +19,22 @@
   margin: 1em 0;
   padding: 0.5em 0.75em;
 }
-a.button:hover {
-  background: $link-color;
-  border: 1px solid $link-color;
-  color: $background-color;
-  text-decoration: none;
+a.button {
+  @extend .button-link;
+}
+.button-link {
+  &:hover {
+    background: $link-color;
+    border: 1px solid $link-color;
+    color: $background-color;
+    text-decoration: none;
+  }
+}
+.body-link {
+  &:hover {
+    text-decoration: underline;
+    color: darken($link-color, 15%);
+  }
 }
 // States
 .disabled {

diff --git a/_sass/layouts/_index.scss b/_sass/layouts/_index.scss
@@ -24,8 +24,8 @@
     display: inline-block;
     background-size: $feature-image-size;
     border-bottom: 1px solid $border-color;
-    p a:hover {
-      @extend %link-hover;
+    p a {
+      @extend .body-link;
     }
   }
   .excerpt {

diff --git a/_sass/layouts/_posts.scss b/_sass/layouts/_posts.scss
@@ -13,8 +13,8 @@ article {
     margin-bottom: 6%;
     text-align: center;
   }
-  a:hover {
-    @extend %link-hover;
+  a {
+    @extend .body-link;
   }
   .footnotes {
     font-size: 0.9em;
@@ -54,7 +54,7 @@ header {
 @media screen and (max-width: 576px) {
   .feature-image .post-content {
     padding: $padding-small;
-  }  
+  }
 }
 // Post navigation
 #post-nav {
@@ -77,6 +77,7 @@ header {
   }
 
   a {
+    @extend .button-link;
     padding: 2em 3em;
     border: 1px solid rgba(255, 255, 255, 0);
     text-align: center;
@@ -85,12 +86,8 @@ header {
       width: 100%;
     }
   }
-  a:hover {
-    @extend a.button:hover;
-  }
 
   i {
     vertical-align: middle;
   }
 }
-