From f5e71bf9892676562a3e6b2ce49e6afaee70e02b Mon Sep 17 00:00:00 2001 From: indifferentketchup Date: Wed, 3 Jun 2026 14:49:42 +0000 Subject: [PATCH] fix(themes): show the rain/neon field behind the app background The AppShell root carries `bg-background`; on a full-viewport element that ~86%-opaque panel token painted a sheet over the z-0 canvas, hiding the matrix rain (Classic) and neon field (Override) behind it while pseudo- element effects like the scanline still showed. Make the root transparent for both canvas themes so the field shows through; the opaque html backstop stays the base and panels keep their own translucent backgrounds. Co-Authored-By: Claude Opus 4.8 (1M context) --- apps/web/src/styles/themes/boocode-classic.css | 10 ++++++++++ apps/web/src/styles/themes/boocode-override.css | 10 ++++++++++ 2 files changed, 20 insertions(+) diff --git a/apps/web/src/styles/themes/boocode-classic.css b/apps/web/src/styles/themes/boocode-classic.css index 62fd36f..23c9095 100644 --- a/apps/web/src/styles/themes/boocode-classic.css +++ b/apps/web/src/styles/themes/boocode-classic.css @@ -55,3 +55,13 @@ html.theme-boocode-classic { .theme-boocode-classic body { background-color: transparent !important; } + +/* The AppShell root (.h-dvh.bg-background) is a full-viewport element carrying + the translucent --background panel token; at ~86% opacity that sheet would + occlude the rain canvas (z-0) behind it. Make the root transparent so the rain + shows through — the html backstop (#0a0604) is the opaque base, and individual + panels (sidebar/cards/composer) keep their own translucent bg for legibility. + The compound .h-dvh.bg-background selector targets only the AppShell root. */ +.theme-boocode-classic .h-dvh.bg-background { + background-color: transparent !important; +} diff --git a/apps/web/src/styles/themes/boocode-override.css b/apps/web/src/styles/themes/boocode-override.css index 55b357e..c56a101 100644 --- a/apps/web/src/styles/themes/boocode-override.css +++ b/apps/web/src/styles/themes/boocode-override.css @@ -57,3 +57,13 @@ html.theme-boocode-override { .theme-boocode-override body { background-color: transparent !important; } + +/* The AppShell root (.h-dvh.bg-background) is a full-viewport element carrying + the translucent --background panel token; at ~86% opacity that sheet would + occlude the NeonField canvas (z-0) behind it. Make the root transparent so the + field shows through — the html backstop (#0a0604) is the opaque base, and + individual panels (sidebar/cards/composer) keep their own translucent bg for + legibility. The compound .h-dvh.bg-background selector targets only the root. */ +.theme-boocode-override .h-dvh.bg-background { + background-color: transparent !important; +}