From c6fe9437aa7b1537759fc0efc2fa53c899989b95 Mon Sep 17 00:00:00 2001
From: Will Estes <westes575@gmail.com>
Date: Tue, 4 Aug 2026 05:48:39 -0400
Subject: [PATCH] Fix unreadable body text in dark mode
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

--color-ink stayed dark in the dark-mode override (correct for text on
--color-bg-raised, which deliberately stays light parchment) while
--color-bg went dark — so body text, headings, and secondary text all
rendered dark-on-dark. Splits out --color-ink-on-raised for the
raised-surface case (blockquote/code/pre/input, unchanged) and flips
--color-ink/--color-ink-heading/--color-ink-soft to light for the
base-page-ground case. Verified against a local Hugo build in a
dark-mode browser, including that raised-surface elements (inline code)
kept their correct dark-on-light contrast.
---
 assets/css/main.css | 27 +++++++++++++++++++++++----
 1 file changed, 23 insertions(+), 4 deletions(-)

diff --git a/assets/css/main.css b/assets/css/main.css
index c90bd23..2edb1a5 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -73,6 +73,14 @@
   --color-ink-soft: #4a3f30;     /* metadata, dividers, quiet secondary text */
   --color-border: #d8c9a3;
 
+  /* Text sitting on a *raised* surface (blockquote/code/pre/input, all
+     --color-bg-raised) — split from --color-ink because dark mode keeps
+     raised surfaces light parchment while the page ground goes dark, so
+     the two contexts need opposite ink colors; identical to --color-ink
+     here since light mode's raised surfaces are barely different from its
+     page ground. */
+  --color-ink-on-raised: #241c14;
+
   --color-accent: #1d4f91;       /* cobalt — links, rules, emphasis */
   --color-accent-hover: #163b70;
   --color-gold: #a9812e;         /* ornament — drop caps, sparingly */
@@ -104,9 +112,17 @@
   :root {
     --color-bg: #12201a;
     --color-bg-raised: #efe6cd;
-    --color-ink: #2a2013;
-    --color-ink-heading: #1c150c;
-    --color-ink-soft: #52432c;
+    /* Page ground goes dark here, but raised surfaces (blockquote/code/
+       pre/input) deliberately stay light parchment — see the
+       --color-ink-on-raised definition above for why body text and
+       raised-surface text can't share one variable. This was a real bug
+       before that split existed: --color-ink stayed dark (correct for
+       raised surfaces) while --color-bg went dark, so body text rendered
+       dark-on-dark and was nearly unreadable. */
+    --color-ink: #e8dfc8;
+    --color-ink-heading: #f5efdd;
+    --color-ink-soft: #a89a7c;
+    --color-ink-on-raised: #2a2013;
     --color-border: #cabb92;
 
     --color-accent: #5b83c9;
@@ -227,6 +243,7 @@ blockquote {
   padding: var(--space-2) var(--space-3);
   border-left: 3px solid var(--color-accent);
   background-color: var(--color-bg-raised);
+  color: var(--color-ink-on-raised);
   font-style: italic;
 }
 
@@ -268,12 +285,14 @@ code, pre {
 
 code {
   background-color: var(--color-bg-raised);
+  color: var(--color-ink-on-raised);
   padding: 0.1em 0.35em;
   border-radius: 3px;
 }
 
 pre {
   background-color: var(--color-bg-raised);
+  color: var(--color-ink-on-raised);
   padding: var(--space-2);
   overflow-x: auto;
   border-radius: 4px;
@@ -414,7 +433,7 @@ textarea {
   width: 100%;
   font-family: var(--font-ui);
   font-size: 1rem;
-  color: var(--color-ink);
+  color: var(--color-ink-on-raised);
   background-color: var(--color-bg-raised);
   border: 1px solid var(--color-border);
   border-radius: 4px;