From 0f3d682da42513d2a4abb3cdbac538e6ec1eeec2 Mon Sep 17 00:00:00 2001 From: hobokenchicken Date: Sat, 14 Feb 2026 00:45:08 -0500 Subject: [PATCH] feat(css): apply custom earthy color scheme #3D2200 #F8FDDD #FF851B --- static/css/custom.css | 169 ++++++++++++++++++++++++------------------ 1 file changed, 97 insertions(+), 72 deletions(-) diff --git a/static/css/custom.css b/static/css/custom.css index f7a18ec..d67a460 100644 --- a/static/css/custom.css +++ b/static/css/custom.css @@ -1,88 +1,113 @@ -/* Custom font overrides for DM Mono */ -html { - letter-spacing: normal; +/* Custom color scheme override */ +:root { + /* Light theme */ + --color-background: #F8FDDD; + --color-background-secondary: #f0e8cc; + --color-background-header: #F8FDDD; + --color-text: #3D2200; + --color-text-secondary: #5a3a0a; + --color-border: #e6d4b3; + + /* Dark theme (inverted for good contrast) */ + --color-background-dark: #2d1d00; + --color-background-secondary-dark: #4a3700; + --color-text-dark: #F8FDDD; + --color-text-secondary-dark: #e6d4b3; + --color-border-dark: #664b00; + + /* Accents */ + --color-accent: #FF851B; + --color-accent-hover: #e67315; } +/* Light theme overrides */ +.light { + background-color: var(--color-background); + color: var(--color-text); +} + +.light .content-inner { + background-color: var(--color-background); + color: var(--color-text); +} + +.light h1, .light h2, .light h3, .light h4, .light h5, .light h6 { + color: var(--color-text); +} + +.light a { + color: var(--color-accent); +} + +.light a:hover { + color: var(--color-accent-hover); +} + +.light .border { + border-color: var(--color-border); +} + +/* Dark theme overrides */ +.dark { + background-color: var(--color-background-dark); + color: var(--color-text-dark); +} + +.dark .content-inner { + background-color: var(--color-background-dark); + color: var(--color-text-dark); +} + +.dark h1, .dark h2, .dark h3, .dark h4, .dark h5, .dark h6 { + color: var(--color-text-dark); +} + +.dark a { + color: var(--color-accent); +} + +.dark a:hover { + color: var(--color-accent-hover); +} + +.dark .border { + border-color: var(--color-border-dark); +} + +/* Personal theme overrides (if active) */ body { - font-family: 'DM Mono', monospace; - font-weight: 400; - line-height: 1.6; + background-color: var(--color-background, #F8FDDD); + color: var(--color-text, #3D2200); } -/* Headings */ -h1, h2, h3, h4, h5, h6 { - font-family: 'DM Mono', monospace; - font-weight: 500; +header { + border-bottom-color: var(--color-border, #e6d4b3); } -/* Code blocks and inline code */ -pre, code, kbd, samp { - font-family: 'DM Mono', monospace; +nav a { + color: var(--color-text-secondary, #5a3a0a); } -/* Logo */ -.logo { - font-family: 'DM Mono', monospace; +nav a:hover, nav a.active { + color: var(--color-text, #3D2200); } -/* Prism.js syntax highlighting */ -.token, -.language-css .token, -.language-scss .token, -.language-sass .token, -.language-less .token, -.language-stylus .token, -.language-json .token, -.language-markup .token, -.language-javascript .token, -.language-typescript .token, -.language-jsx .token, -.language-tsx .token, -.language-python .token, -.language-ruby .token, -.language-java .token, -.language-c .token, -.language-cpp .token, -.language-csharp .token, -.language-go .token, -.language-rust .token, -.language-php .token, -.language-swift .token, -.language-kotlin .token, -.language-scala .token, -.language-haskell .token, -.language-elixir .token, -.language-erlang .token, -.language-clojure .token, -.language-lua .token, -.language-perl .token, -.language-sql .token, -.language-graphql .token, -.language-yaml .token, -.language-toml .token, -.language-bash .token, -.language-shell .token, -.language-docker .token, -.language-nginx .token, -.language-apache .token, -.language-vim .token, -.language-git .token, -.language-diff .token { - font-family: 'DM Mono', monospace; +nav a.active::after { + background-color: var(--color-text, #3D2200); } -/* Normalize.css overrides */ -code, -kbd, -samp, -pre, -input, -textarea, -select { - font-family: 'DM Mono', monospace; +footer { + border-top-color: var(--color-border, #e6d4b3); + color: var(--color-text-secondary, #5a3a0a); } -/* Keep serif for blockquote decorative element */ -blockquote:before { - font-family: Georgia, serif; +/* Buttons and interactive elements */ +button, .button { + background-color: var(--color-accent); + color: white; + border-color: var(--color-accent); +} + +button:hover, .button:hover { + background-color: var(--color-accent-hover); } \ No newline at end of file