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) <noreply@anthropic.com>
This commit is contained in:
2026-06-03 14:49:42 +00:00
parent 4a53921cdc
commit f5e71bf989
2 changed files with 20 additions and 0 deletions

View File

@@ -55,3 +55,13 @@ html.theme-boocode-classic {
.theme-boocode-classic body { .theme-boocode-classic body {
background-color: transparent !important; 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;
}

View File

@@ -57,3 +57,13 @@ html.theme-boocode-override {
.theme-boocode-override body { .theme-boocode-override body {
background-color: transparent !important; 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;
}