1 files changed, 22 insertions, 7 deletions

diff --git a/assets/css/_vars.scss b/assets/css/_vars.scss
index 832c410..d650842 100644
--- a/assets/css/_vars.scss
+++ b/assets/css/_vars.scss
@@ -133,12 +133,27 @@ $content--width:  42rem;
     $gray6: hsl(220, 7%, 16%);
     $gray7: hsl(220, 7%, 0%);
 
-    $link-idle: hsl(220, 60%, 40%);
-
-    $theme-link-bg:    change-color($link-idle, $lightness: 98.8%);
-    $theme-link-obj:   rgba($link-idle, .5);
-    $theme-link-fg-hi: mix($link-idle, $gray0, 75%);
-    $theme-link-fg:    $link-idle;
+    $theme-link-bg: hsl(
+        var(--colors--accent--h),
+        var(--colors--accent--s),
+        98.8%
+    );
+    $theme-link-obj: hsla(
+        var(--colors--accent--h),
+        var(--colors--accent--s),
+        var(--colors--accent--l),
+        .5
+    );
+    $theme-link-fg: hsl(
+        var(--colors--accent--h),
+        var(--colors--accent--s),
+        calc(var(--colors--accent--l) * .8)
+    );
+    $theme-link-fg-hi: hsl(
+        var(--colors--accent--h),
+        calc(var(--colors--accent--s) * .6),
+        calc(var(--colors--accent--l) * 1.2)
+    );
 
     @include store((
         --colors: (
@@ -200,7 +215,7 @@ $content--width:  42rem;
 
             --link: (
                 --colored: (
-                    --idle:    $link-idle, //hsl(var(--colors--accent--h), 100%, 66%), //
+                    --idle:    hsl(220, 60%, 40%), //hsl(var(--colors--accent--h), 100%, 66%), //
                     --visited: hsl(290, 30%, 35%), //hsl(var(--colors--accent--h), 50%, 66%), //
                 )
             ),