css: Move custom properties to their own file

In preparation for making man.css respect prefers-color-scheme, move all
custom properties to their own file so they can be included easily.

1 files changed, 33 insertions, 0 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;
+	}
+}