From a4e891c8b5990ed56c5b3a0b7df2707f785d9d1d Mon Sep 17 00:00:00 2001
From: Solomon Laing <solomonlaing@protonmail.com>
Date: Mon, 14 Jun 2021 16:19:37 +0930
Subject: [PATCH] first go of nav restyle is complete, removed blue and
 replaced with visual que

---
 src/app/home/home.component.scss                          | 6 +++---
 src/app/links/links.component.scss                        | 4 ++--
 src/app/nav/nav.component.scss                            | 8 ++++----
 src/app/projects/project-card/project-card.component.scss | 4 ++--
 src/app/projects/projects.component.scss                  | 2 +-
 src/app/shared/styles/_variables.color.scss               | 8 ++++----
 src/styles.scss                                           | 2 +-
 7 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/src/app/home/home.component.scss b/src/app/home/home.component.scss
index a287f14..0321415 100644
--- a/src/app/home/home.component.scss
+++ b/src/app/home/home.component.scss
@@ -19,7 +19,7 @@
         .headshot {
             width: 200px;
             height: 200px;
-            border: colors.$inklets-color-fg 5px solid;
+            border: colors.$inklets-color-red-light 5px solid;
             border-radius: 100px;
         }
     
@@ -27,7 +27,7 @@
             margin-left: 30px;
 
             h1 {
-                border-bottom: colors.$inklets-color-fg 2px dashed;
+                border-bottom: colors.$inklets-color-red-light 2px dashed;
 
                 img {
                     width: 30px;
@@ -50,7 +50,7 @@
             color: colors.$inklets-color-white;
         }
         > a:hover {
-            color: colors.$inklets-color-fg;
+            color: colors.$inklets-color-red-light;
         }
     }
 }
\ No newline at end of file
diff --git a/src/app/links/links.component.scss b/src/app/links/links.component.scss
index f6564c0..9900556 100644
--- a/src/app/links/links.component.scss
+++ b/src/app/links/links.component.scss
@@ -28,7 +28,7 @@ a {
     margin: 0;
     color: colors.$inklets-color-white;
     background-color: colors.$inklets-color-black;
-    border: 2px solid colors.$inklets-color-bg;
+    border: 2px solid colors.$inklets-color-red-dark;
     border-radius: 10px;
 
     > * {
@@ -38,5 +38,5 @@ a {
 }
 
 a:hover {
-    border: colors.$inklets-color-fg 2px solid;
+    border: colors.$inklets-color-red-light 2px solid;
   }
\ No newline at end of file
diff --git a/src/app/nav/nav.component.scss b/src/app/nav/nav.component.scss
index 9b344fb..696b855 100644
--- a/src/app/nav/nav.component.scss
+++ b/src/app/nav/nav.component.scss
@@ -23,24 +23,24 @@ li a {
   height: 100px;
   line-height: 100px;
   color: colors.$inklets-color-white;
-  background-color: colors.$inklets-color-bg;
+  background-color: colors.$inklets-color-red-dark;
   display: block;
   text-align: center;
   text-decoration: none;
 }
 
 li .activeRoute {
-  background-color: colors.$inklets-color-fg;
+  background-color: colors.$inklets-color-red-light;
   color: colors.$inklets-color-black;
 }
 
 // li a:hover {
-//   background-color: colors.$inklets-color-highlight-bg;
+//   background-color: colors.$inklets-color-blue-dark;
 //   color: colors.$inklets-color-white;
 // }
 
 
 //  li a:hover.activeRoute {
-//   background-color: colors.$inklets-color-highlight-fg;
+//   background-color: colors.$inklets-color-blue-light;
 //   color: colors.$inklets-color-black;
 // }
diff --git a/src/app/projects/project-card/project-card.component.scss b/src/app/projects/project-card/project-card.component.scss
index c47453d..7710bae 100644
--- a/src/app/projects/project-card/project-card.component.scss
+++ b/src/app/projects/project-card/project-card.component.scss
@@ -8,14 +8,14 @@
     a {
         color: colors.$inklets-color-white;
         background-color: colors.$inklets-color-black;
-        border: 2px solid colors.$inklets-color-bg;
+        border: 2px solid colors.$inklets-color-red-dark;
         text-decoration: none;
         padding: 15px 20px 15px 20px;
         border-radius: 10px;
     }
 
     a:hover {
-        border: 2px solid colors.$inklets-color-fg;
+        border: 2px solid colors.$inklets-color-red-light;
     }
 
     .right {
diff --git a/src/app/projects/projects.component.scss b/src/app/projects/projects.component.scss
index 66ca070..3be2d70 100644
--- a/src/app/projects/projects.component.scss
+++ b/src/app/projects/projects.component.scss
@@ -8,6 +8,6 @@
   padding: 0 20px 0 20px;
 
   h2 {
-      border-bottom: colors.$inklets-color-fg 2px dashed;
+      border-bottom: colors.$inklets-color-red-light 2px dashed;
   }
 }
diff --git a/src/app/shared/styles/_variables.color.scss b/src/app/shared/styles/_variables.color.scss
index 5eefc32..a298a6d 100644
--- a/src/app/shared/styles/_variables.color.scss
+++ b/src/app/shared/styles/_variables.color.scss
@@ -14,8 +14,8 @@
 $inklets-color-black: #0e0906;
 $inklets-color-grey: #191511;
 $inklets-color-white: #f4efea;
-$inklets-color-highlight-bg: #181846;
-$inklets-color-highlight-fg:#6a9ccc;
-$inklets-color-bg:#6d1d00;
-$inklets-color-fg:#e6906c;
+$inklets-color-red-dark:#6d1d00;
+$inklets-color-red-light:#e6906c;
+$inklets-color-blue-dark: #181846;
+$inklets-color-blue-light:#6a9ccc;
 $inklets-color-text-highlight: #f5d870;
\ No newline at end of file
diff --git a/src/styles.scss b/src/styles.scss
index 74adf1a..bfe7946 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -99,7 +99,7 @@ span.linenos.special { color: #979797; background-color: #ffffc0; padding-left:
 }
 
 * a:hover {
-    color: colors.$inklets-color-highlight-fg;
+    color: colors.$inklets-color-blue-light;
 }
 
 * img {