feat: theme

This commit is contained in:
Barrett Ruth 2025-11-09 14:35:00 -05:00
parent 8df0766439
commit fb0229d80e
7 changed files with 89 additions and 13 deletions

View file

@ -142,6 +142,40 @@
font-display: swap;
}
:root {
--bg: #fff;
--text: #000;
--code-bg: #f4f4f4;
--border: #e1e1e1;
--grid-color: rgba(200, 200, 200, 0.4);
}
@media (prefers-color-scheme: dark) {
:root {
--bg: #000;
--text: #fff;
--code-bg: #0a0a0a;
--border: #1a1a1a;
--grid-color: rgba(55, 55, 55, 0.4);
}
}
[data-theme="light"] {
--bg: #fff;
--text: #000;
--code-bg: #f4f4f4;
--border: #e1e1e1;
--grid-color: rgba(200, 200, 200, 0.4);
}
[data-theme="dark"] {
--bg: #000;
--text: #fff;
--code-bg: #0a0a0a;
--border: #1a1a1a;
--grid-color: rgba(55, 55, 55, 0.4);
}
pre,
code,
pre code,
@ -158,9 +192,11 @@ body {
font-family: "Signifier", serif;
margin: 0;
padding: 0;
height: 100%;
min-height: 100vh;
display: flex;
flex-direction: column;
background: var(--bg);
color: var(--text);
}
header,
@ -191,8 +227,8 @@ li {
.graph-background {
background-image:
linear-gradient(to right, rgba(200, 200, 200, 0.4) 1px, transparent 1px),
linear-gradient(to bottom, rgba(200, 200, 200, 0.4) 1px, transparent 1px);
linear-gradient(to right, var(--grid-color) 1px, transparent 1px),
linear-gradient(to bottom, var(--grid-color) 1px, transparent 1px);
background-size: 3vw 3vw;
}
@ -200,8 +236,8 @@ li {
display: inline-block;
width: 10px;
height: 1em;
background-color: white;
border: 1px solid black;
background-color: var(--bg);
border: 1px solid var(--text);
vertical-align: text-top;
animation: blink 1s step-start infinite;
}