diff options
| -rw-r--r-- | scss/_vars.scss | 33 | ||||
| -rw-r--r-- | scss/style.scss | 35 |
2 files changed, 34 insertions, 34 deletions
diff --git a/scss/_vars.scss b/scss/_vars.scss new file mode 100644 index 0000000..7ce46a8 --- /dev/null +++ b/scss/_vars.scss @@ -0,0 +1,33 @@ +:root { + --font-sans: Alegreya Sans, sans; + --font-serif: Alegreya, serif; + --font-mono: Iosevka, Inconsolata, monospace; + + --font-size-pre: 85%; + + --fg-color: black; + --fg-color-canary: #191900; + --fg-color-mute: #5a5a5a; + --fg-href: #0000ee; + --fg-href-visited: #551a8b; + + --bg-color: white; + --bg-color-canary: #ffffc3; + --bg-color-yellow: #ffd400; + + --border-color-light: lightgrey; + --border-color-dark: darkgrey; +} + +@media (prefers-color-scheme: dark) { + :root { + --fg-color: #f0f0f0; + --fg-color-canary: #e9e9f0; + --fg-color-mute: #7a7a7a; + --fg-href: #6464ff; + --fg-href-visited: #9547dd; + + --bg-color: #1c1c1c; + --bg-color-canary: #323232; + } +} diff --git a/scss/style.scss b/scss/style.scss index d5bd770..e56b390 100644 --- a/scss/style.scss +++ b/scss/style.scss @@ -1,39 +1,6 @@ @import '_webfonts'; @import '_responsive_fonts'; - -:root { - --font-sans: Alegreya Sans, sans; - --font-serif: Alegreya, serif; - --font-mono: Iosevka, Inconsolata, monospace; - - --font-size-pre: 85%; - - --fg-color: black; - --fg-color-canary: #191900; - --fg-color-mute: #5a5a5a; - --fg-href: #0000ee; - --fg-href-visited: #551a8b; - - --bg-color: white; - --bg-color-canary: #ffffc3; - --bg-color-yellow: #ffd400; - - --border-color-light: lightgrey; - --border-color-dark: darkgrey; -} - -@media (prefers-color-scheme: dark) { - :root { - --fg-color: #f0f0f0; - --fg-color-canary: #e9e9f0; - --fg-color-mute: #7a7a7a; - --fg-href: #6464ff; - --fg-href-visited: #9547dd; - - --bg-color: #1c1c1c; - --bg-color-canary: #323232; - } -} +@import '_vars'; a { color: var(--fg-href); |