From 598b5e44aa2f949ac470a46a9c850d62211cec42 Mon Sep 17 00:00:00 2001
From: Volpeon <git@volpeon.ink>
Date: Mon, 28 Dec 2020 18:23:37 +0100
Subject: Improved CSS vars and scopes

---
 assets/css/_vars.scss | 54 ++++++++++++++++++++++++++++++---------------------
 1 file changed, 32 insertions(+), 22 deletions(-)

(limited to 'assets/css/_vars.scss')

diff --git a/assets/css/_vars.scss b/assets/css/_vars.scss
index 9cd4b24..2242f09 100644
--- a/assets/css/_vars.scss
+++ b/assets/css/_vars.scss
@@ -34,35 +34,45 @@ $breakpoints: (
     --gray2: hsl(270, 1%, 29%);
     --gray3: hsl(270, 2%, 54%);
     --gray4: hsl(270, 2%, 73%);
-    --gray5: hsl(270, 2%, 83%);
-    --gray6: hsl(270, 2%, 100%);
+    --gray5: hsl(270, 2%, 86%);
+    --gray5: hsl(270, 2%, 100%);
 
-    --bg-minus: var(--gray0);
-    --bg: var(--gray1);
-    --bg-plus: var(--gray2);
-    --fg-minus: var(--gray3);
-    --fg: var(--gray4);
-    --fg-plus: var(--gray5);
-    --fg-plus-2: var(--gray6);
+    //
 
-    --heading--fg: var(--fg-plus-2);
+    --bg-hi: var(--gray0); // Lighter background
+    --bg:    var(--gray1); // Background
+
+    --obj:   var(--gray2);
+
+    --fg-hi: var(--gray3); // Faint text
+    --fg:    var(--gray4); // Text
+    --fg-lo: var(--gray5); // Strong text
+
+    //
+
+    --heading--fg: var(--fg-lo);
 
     --select--bg: hsla(270, 2%, 100%, .996);
-    --select--fg: var(--bg-minus);
+    --select--fg: var(--bg-hi);
 
-    --code--fg: var(--fg-minus);
-    --code-block--fg: var(--fg-minus);
+    --code--fg: var(--fg-hi);
 
-    --page--item-prefix--fg: var(--fg-minus);
+    --code-block--fg: var(--fg-hi);
 
-    --link--idle--fg: var(--fg-plus-2); //#90acf2;
-    --link--visited--fg: var(--fg-plus); //#bc9df2;
-    --link--hover--bg: var(--fg-plus-2);
-    --link--hover--fg: var(--bg-minus);
+    --link--idle--fg: var(--fg-lo);
+    --link--hover--bg: var(--link--idle--fg);
+    --link--hover--fg: #000;
 
-    --nav--bg: var(--bg-minus);
-    --nav--logo--fg: var(--fg-minus);
+    --nav--bg: var(--bg-hi);
+    --nav--logo--fg: var(--fg-hi);
     --nav--item--idle--fg: var(--fg);
-    --nav--item--hover--fg: var(--fg-plus-2);
-    --nav--item--active--fg: var(--fg-plus-2);
+    --nav--item--hover--fg: var(--fg-lo);
+    --nav--item--active--fg: var(--fg-lo);
+
+    --page--item-prefix--fg: var(--fg-hi);
+
+    --page--link--idle--fg: var(--link--idle--fg); // hsl(45, 100%, 70%); // hsl(215, 100%, 80%); // var(--link--idle--fg); // #ffd866;
+    --page--link--visited--fg: var(--fg); // hsl(23, 89%, 65%); // hsl(260, 58%, 78%);  // var(--fg-lo); // #f59458;
+    --page--link--hover--bg: var(--page--link--idle--fg);
+    --page--link--hover--fg: #000;
 }
-- 
cgit v1.2.3-54-g00ecf