main.scss refactoring

src/style/main.scss

@@ -23,19 +23,20 @@ h2{
 
 h3{
   margin-bottom:  $single-margin / 2;
-}
 
-.body-wrapper {
-  display: flex;
-  min-height: 100%;
-  flex-direction: column;
-}
+  a {
+    color: $dark-color;
+    text-decoration: none;
+    border-bottom: 1px solid lighten($dark-color, 10%);
 
-.body-wrapper__content {
-  $margin: $single-margin + $menu-width;
+    &:hover {
+      border-bottom: 1px solid lighten($dark-color, 25%);
+    }
 
-  flex: 1;
-  margin: $margin auto 0;
+    &:active {
+      border-bottom: 1px solid $dark-color;
+    }
+  }
 }
 
 a {
@@ -56,16 +57,15 @@ a {
   }
 }
 
-h3 a {
-  color: black;
-  text-decoration: none;
-  border-bottom: 1px solid #ddd;
+.body-wrapper {
+  display: flex;
+  min-height: 100%;
+  flex-direction: column;
+}
 
-  &:hover {
-    border-bottom: 1px solid #484848;
-  }
+.body-wrapper__content {
+  $margin: $single-margin + $menu-width;
 
-  &:active {
-    border-bottom: 1px solid #000000;
-  }
+  flex: 1;
+  margin: $margin auto 0;
 }