From 42fe1035c87c5e7222911668a4cbed2f029da323 Mon Sep 17 00:00:00 2001
From: ManjaroOne666 <git@gabbaell.co.uk>
Date: Wed, 23 Jan 2019 12:08:58 +0000
Subject: [PATCH] menu styling

---
 components/SiteMenu.vue | 37 +++++++++++++++++++++++++++++--------
 1 file changed, 29 insertions(+), 8 deletions(-)

diff --git a/components/SiteMenu.vue b/components/SiteMenu.vue
index cb4c944..088f6e8 100644
--- a/components/SiteMenu.vue
+++ b/components/SiteMenu.vue
@@ -130,7 +130,7 @@ $transition-timing: .5s;
 }
 
 .menu-content {
-  $color-bg: $color__primary-100;
+  $color-bg: $color__neutral-200;
 
   display: flex;
   flex-direction: column;
@@ -316,9 +316,22 @@ $transition-timing: .5s;
     display: block;
     padding: .2em 0;
 
+    color: $color__neutral-800;
+    transition: opacity .5s;
+    opacity: .9;
+
+    &:link, &:visited {
+      opacity: .9;
+    }
+
+    &:hover, &:active {
+      opacity: .5;
+    }
+
     &.nuxt-link-exact-active {
       pointer-events: none;
-      color: $color__primary-700;
+      color: $color__primary-900;
+      opacity: 1;
     }
 
     @media (min-width: $bp__layout) {
@@ -339,7 +352,7 @@ $transition-timing: .5s;
 
         border-radius: 50%;
 
-        background-color: $color__primary-700;
+        background-color: $color__neutral-600;
         
         transition: opacity .5s;
         opacity: 0;
@@ -361,9 +374,6 @@ $transition-timing: .5s;
 .social-nav {
   list-style: none;
   display: flex;
-
-  @media (min-width: $bp__layout) {
-  }
 }
 
   .social-nav__link {
@@ -371,7 +381,17 @@ $transition-timing: .5s;
     height: 2em;
     width: 5ch;
 
-    opacity: .7;
+    transition: opacity .5s;
+    color: $color__neutral-900;
+
+    &:link, &:visited {
+      opacity: .8;
+      color: $color__neutral-900;
+    }
+
+    &:hover, &:active {
+      opacity: .5;
+    }
 
     @media (min-width: $bp__layout) {
       width: 3ch;
@@ -383,8 +403,9 @@ $transition-timing: .5s;
   }
 
 .footer-attr {
-  color: $color__neutral-500;
+  color: $color__neutral-600;
   font-size: .7em;
+  font-weight: 600;
 }
 
 .menu-toggle {