defensive: explicit body[data-inbox-theme='classic-dense'] selector

44cdbed57a883e749ab71e3a129e164526ec6351 · 2026-05-21 20:08:00 -0700 · Steve Abrams

Previously the classic-dense theme relied on the :root base via *absence*
of an override — switching FROM another theme BACK to classic-dense
worked because CSS cascade restores :root values when overrides aren't
matched, but it's fragile: if a future theme sets a var that no other
theme touches, switching back to classic-dense would leak that var.

Now classic-dense is a positive reset (32 explicit selectors + the :root
base = 33 layers of belt-and-suspenders). All token values mirror the
:root defaults exactly.

Files touched

M app/globals.css

Diff

commit 44cdbed57a883e749ab71e3a129e164526ec6351
Author: Steve Abrams <steve@designerwallcoverings.com>
Date:   Thu May 21 20:08:00 2026 -0700

    defensive: explicit body[data-inbox-theme='classic-dense'] selector
    
    Previously the classic-dense theme relied on the :root base via *absence*
    of an override — switching FROM another theme BACK to classic-dense
    worked because CSS cascade restores :root values when overrides aren't
    matched, but it's fragile: if a future theme sets a var that no other
    theme touches, switching back to classic-dense would leak that var.
    
    Now classic-dense is a positive reset (32 explicit selectors + the :root
    base = 33 layers of belt-and-suspenders). All token values mirror the
    :root defaults exactly.
---
 app/globals.css | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/app/globals.css b/app/globals.css
index 8b76c50..b6be5c9 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -1541,3 +1541,21 @@ body[data-inbox-theme="botanical"] {
   --color-border: #8a9a78; --color-primary: #2a5028; --color-primary-hover: #1a3a18;
   font-family: "Cormorant Garamond", "EB Garamond", Georgia, serif;
 }
+
+/* v1 Classic Dense — defensive explicit selector. Restores :root tokens in case
+   a previously-applied theme set any vars not overridden by a sibling theme.
+   Without this, switching FROM (say) ottoman-tile BACK TO classic-dense relies
+   on CSS cascade alone — works in practice but fragile if any base var is ever
+   left unset by another theme. With this, classic-dense is a positive reset. */
+body[data-inbox-theme="classic-dense"] {
+  --color-bg:             #f5f5f7;
+  --color-surface:        #ffffff;
+  --color-surface-el:     #f0f0f2;
+  --color-text:           #1a1a2e;
+  --color-text-secondary: #4a4a5e;
+  --color-text-muted:     #585e6b;
+  --color-border:         #e2e4e9;
+  --color-primary:        #0a7c59;
+  --color-primary-hover:  #065f46;
+  font-family: -apple-system, BlinkMacSystemFont, "Inter", "Plus Jakarta Sans", system-ui, sans-serif;
+}

← 76b8e92 feat(theme): hoist InboxThemeBanner + AgeThemeSlider into ap · back to Norma · norma-scraper: load .env.local via interpreter_args so SESSI 0713748 →