Move color variables from main.css to root.css; split body and header colors

This commit is contained in:
Eryn Wells 2022-09-25 08:48:21 -07:00
parent 979cd1bbcb
commit 10d7c586c0
2 changed files with 8 additions and 12 deletions

View file

@ -7,9 +7,7 @@
--header: 8rem;
--footer: calc(8rem + var(--safe-bottom));
--light: #fff;
--light-dim: #888;
--dark: rgb(22, 22, 22);
--highlight-color: rgb(50, 186, 228);
--hljs-bg: #111;
@ -18,9 +16,6 @@
--body-padding: 4rem;
--body-width: 80rem;
--body-background-color: var(--light);
--body-foreground-color: var(--dark);
--heading-color: var(--body-foreground-color);
--link-color: var(--highlight-color);
@ -30,15 +25,10 @@
--tag-text-color: var(--dark);
--tag-background-color: #eee;
--tag-hover-background-color: #bbb;
--separator-color: #888;
}
@media (prefers-color-scheme: dark) {
:root {
--body-background-color: var(--dark);
--body-foreground-color: var(--light);
--tag-text-color: var(--light-dim);
--tag-background-color: rgb(40, 40, 40);
--tag-hover-background-color: rgb(73, 73, 73);