diff --git a/base.css b/base.css index 7c0a811..d841678 100644 --- a/base.css +++ b/base.css @@ -1,8 +1,13 @@ +@import url("https://styles.alv.cx/modules/colors/gruvbox.css"); + :root { - --fg: #454545; - --bg: #fefefe; - --a: #07a; - --a-visited: #941352; + --light: var(--gruvbox-fg); + --dark: var(--gruvbox-bg); + + --fg: var(--dark); + --bg: var(--light); + --a: var(--gruvbox-blue); + --a-visited: var(--gruvbox-purple); } body { diff --git a/modules/colors/gruvbox.css b/modules/colors/gruvbox.css index 4251627..41e251b 100644 --- a/modules/colors/gruvbox.css +++ b/modules/colors/gruvbox.css @@ -16,4 +16,20 @@ --gruvbox-blue-light: #83a598; --gruvbox-purple-light: #d3869b; --gruvbox-aqua-light: #8ec07c; + + --gruvbox-bg: #282828; /* default background */ + --gruvbox-bg0_h: #1d2021; /* hard background */ + --gruvbox-bg0_s: #32302f; /* soft background */ + --gruvbox-bg0: #282828; /* same as bg */ + --gruvbox-bg1: #3c3836; + --gruvbox-bg2: #504945; + --gruvbox-bg3: #665c54; + --gruvbox-bg4: #7c6f64; + --gruvbox-fg: #ebdbb2; + --gruvbox-fg0: #fbf1c7; + --gruvbox-fg1: #ebdbb2; + --gruvbox-fg2: #d5c4a1; + --gruvbox-fg3: #bdae93; + --gruvbox-fg4: #a89984; + --gruvbox-gray: #928374; } diff --git a/modules/darkmode.css b/modules/darkmode.css index f21c0c5..cf82e2d 100644 --- a/modules/darkmode.css +++ b/modules/darkmode.css @@ -1,9 +1,7 @@ @media (prefers-color-scheme: dark) { :root { - --fg: #ccc; - --bg: #111; - --a: #07a; - --a-visited: #aa346d; + --fg: var(--light); + --bg: var(--dark); } img, video { opacity: .75;