foster/website
1
0
Fork 0
Code Issues 8 Pull requests Activity

Make dark theme the default

Browse source
This commit is contained in:
Foster Hangdaan 2023-08-01 22:10:31 -04:00
parent f06b41a384
commit b64b8a62da
Signed by: foster
GPG key ID: E48D7F49A852F112
1 changed files with 35 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

70
_includes/styles/color-palette.scss
View file

@ -81,43 +81,43 @@ :root {
/* semantic color variables for this project */ /* semantic color variables for this project */
:root { :root {
--color-bg: var(--tn-light--background); --color-bg: var(--tn-storm--background);
--color-fg: var(--tn-light--foreground); --color-fg: var(--tn-night--foreground);
--color-black: var(--tn-light--black); --color-black: var(--tn-dark--black);
--color-white: var(--tn-light--white); --color-white: var(--tn-dark--white);
--color-red: var(--tn-light--red); --color-red: var(--tn-dark--red);
--color-green: var(--tn-light--green); --color-green: var(--tn-dark--green);
--color-blue: var(--tn-light--blue); --color-blue: var(--tn-dark--blue);
--color-yellow: var(--tn-light--yellow); --color-yellow: var(--tn-dark--yellow);
--color-cyan: var(--tn-light--cyan); --color-cyan: var(--tn-dark--cyan);
--color-magenta: var(--tn-light--magenta); --color-magenta: var(--tn-dark--magenta);
--color-brown: var(--tn-light--brown); --color-brown: var(--tn-dark--brown);
--color-links: var(--tn-light--cyan); --color-links: var(--tn-dark--cyan);
--color-error: var(--tn-light--red); --color-error: var(--tn-dark--red);
--color-success: var(--tn-light--green); --color-success: var(--tn-dark--green);
--color-warn: var(--tn-light--yellow); --color-warn: var(--tn-dark--yellow);
--color-bg--layer-01: var(--tn-light--background-60); --color-bg--layer-01: var(--tn-storm--background-40);
--color-bg--layer-02: var(--tn-light--background-70); --color-bg--layer-02: var(--tn-storm--background-30);
} }
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: light) {
:root { :root {
--color-bg: var(--tn-storm--background); --color-bg: var(--tn-light--background);
--color-fg: var(--tn-night--foreground); --color-fg: var(--tn-light--foreground);
--color-black: var(--tn-dark--black); --color-black: var(--tn-light--black);
--color-white: var(--tn-dark--white); --color-white: var(--tn-light--white);
--color-red: var(--tn-dark--red); --color-red: var(--tn-light--red);
--color-green: var(--tn-dark--green); --color-green: var(--tn-light--green);
--color-blue: var(--tn-dark--blue); --color-blue: var(--tn-light--blue);
--color-yellow: var(--tn-dark--yellow); --color-yellow: var(--tn-light--yellow);
--color-cyan: var(--tn-dark--cyan); --color-cyan: var(--tn-light--cyan);
--color-magenta: var(--tn-dark--magenta); --color-magenta: var(--tn-light--magenta);
--color-brown: var(--tn-dark--brown); --color-brown: var(--tn-light--brown);
--color-links: var(--tn-dark--cyan); --color-links: var(--tn-light--cyan);
--color-error: var(--tn-dark--red); --color-error: var(--tn-light--red);
--color-success: var(--tn-dark--green); --color-success: var(--tn-light--green);
--color-warn: var(--tn-dark--yellow); --color-warn: var(--tn-light--yellow);
--color-bg--layer-01: var(--tn-storm--background-40); --color-bg--layer-01: var(--tn-light--background-60);
--color-bg--layer-02: var(--tn-storm--background-30); --color-bg--layer-02: var(--tn-light--background-70);
} }
} }