summaryrefslogtreecommitdiffstats
path: root/assets/css/_vars.scss
diff options
context:
space:
mode:
Diffstat (limited to 'assets/css/_vars.scss')
-rw-r--r--assets/css/_vars.scss54
1 files changed, 32 insertions, 22 deletions
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: (
34 --gray2: hsl(270, 1%, 29%); 34 --gray2: hsl(270, 1%, 29%);
35 --gray3: hsl(270, 2%, 54%); 35 --gray3: hsl(270, 2%, 54%);
36 --gray4: hsl(270, 2%, 73%); 36 --gray4: hsl(270, 2%, 73%);
37 --gray5: hsl(270, 2%, 83%); 37 --gray5: hsl(270, 2%, 86%);
38 --gray6: hsl(270, 2%, 100%); 38 --gray5: hsl(270, 2%, 100%);
39 39
40 --bg-minus: var(--gray0); 40 //
41 --bg: var(--gray1);
42 --bg-plus: var(--gray2);
43 --fg-minus: var(--gray3);
44 --fg: var(--gray4);
45 --fg-plus: var(--gray5);
46 --fg-plus-2: var(--gray6);
47 41
48 --heading--fg: var(--fg-plus-2); 42 --bg-hi: var(--gray0); // Lighter background
43 --bg: var(--gray1); // Background
44
45 --obj: var(--gray2);
46
47 --fg-hi: var(--gray3); // Faint text
48 --fg: var(--gray4); // Text
49 --fg-lo: var(--gray5); // Strong text
50
51 //
52
53 --heading--fg: var(--fg-lo);
49 54
50 --select--bg: hsla(270, 2%, 100%, .996); 55 --select--bg: hsla(270, 2%, 100%, .996);
51 --select--fg: var(--bg-minus); 56 --select--fg: var(--bg-hi);
52 57
53 --code--fg: var(--fg-minus); 58 --code--fg: var(--fg-hi);
54 --code-block--fg: var(--fg-minus);
55 59
56 --page--item-prefix--fg: var(--fg-minus); 60 --code-block--fg: var(--fg-hi);
57 61
58 --link--idle--fg: var(--fg-plus-2); //#90acf2; 62 --link--idle--fg: var(--fg-lo);
59 --link--visited--fg: var(--fg-plus); //#bc9df2; 63 --link--hover--bg: var(--link--idle--fg);
60 --link--hover--bg: var(--fg-plus-2); 64 --link--hover--fg: #000;
61 --link--hover--fg: var(--bg-minus);
62 65
63 --nav--bg: var(--bg-minus); 66 --nav--bg: var(--bg-hi);
64 --nav--logo--fg: var(--fg-minus); 67 --nav--logo--fg: var(--fg-hi);
65 --nav--item--idle--fg: var(--fg); 68 --nav--item--idle--fg: var(--fg);
66 --nav--item--hover--fg: var(--fg-plus-2); 69 --nav--item--hover--fg: var(--fg-lo);
67 --nav--item--active--fg: var(--fg-plus-2); 70 --nav--item--active--fg: var(--fg-lo);
71
72 --page--item-prefix--fg: var(--fg-hi);
73
74 --page--link--idle--fg: var(--link--idle--fg); // hsl(45, 100%, 70%); // hsl(215, 100%, 80%); // var(--link--idle--fg); // #ffd866;
75 --page--link--visited--fg: var(--fg); // hsl(23, 89%, 65%); // hsl(260, 58%, 78%); // var(--fg-lo); // #f59458;
76 --page--link--hover--bg: var(--page--link--idle--fg);
77 --page--link--hover--fg: #000;
68} 78}