fix(glass): split backdrop-on tier from Plex-art; make app-wide glass near-opaque

Root cause: html[data-backdrop="on"] and .glass-media shared ONE translucent tier, so a value tuned for
Plex art (meant to show its poster through) was forced onto the whole app — over the feed, the nav and
popovers read straight through it. Split them: the app-wide background-image tier is now near-opaque
(surface 88% / card 90% / menu 93% / blur 22px), while the Plex-art tier stays translucent (72/80/85/14).
Tuned live on the user's prod session (50% -> 72% was still too see-through; 88% reads clean). 0.60.2.
This commit is contained in:
2026-08-08 23:20:10 +02:00
parent abd65ff380
commit 5b8f0f0a86
3 changed files with 27 additions and 5 deletions
+1 -1
View File
@@ -1 +1 @@
0.60.1 0.60.2
+19 -4
View File
@@ -97,11 +97,26 @@
(`html[data-backdrop="on"]`), and on the Plex art-backed detail views (`.glass-media`, which (`html[data-backdrop="on"]`), and on the Plex art-backed detail views (`.glass-media`, which
have their own art backdrop even when the global image is off). When there's nothing behind the have their own art backdrop even when the global image is off). When there's nothing behind the
glass (image off / perf), the :root defaults keep it solid & readable. ===== */ glass (image off / perf), the :root defaults keep it solid & readable. ===== */
html[data-backdrop="on"], /* App-wide background image: the glass sits over the FEED (and menus over it), so readability wins.
Near-opaque with a strong blur — the backdrop image still tints through as soft colour, but the feed
behind the nav/popovers no longer punches through. This is SEPARATE from .glass-media below: the two
used to share one tier, which was the root cause — a value tuned for Plex art was forced onto the
whole app. (Tuned live on prod, 2026-08-08: 50% → 72% still too see-through; 88% reads clean.) */
html[data-backdrop="on"] {
--glass-blur: 22px;
--glass-saturate: 1.6;
--glass-dark-bright: 1.2;
--glass-surface-alpha: 88%;
--glass-card-alpha: 90%;
--glass-menu-alpha: 93%;
--glass-border-alpha: 80%;
--glass-edge: 25%;
--glass-inset: 15%;
--glass-scrim: 30%;
}
/* Plex art-backed detail views: the glass sits over the item's OWN poster/art, which is MEANT to show
through richly — keep this tier translucent (unlike the app-wide one above). */
.glass-media { .glass-media {
/* Solidified after user feedback (2026-08-08): 50%/10px let the feed read straight THROUGH the nav
and popovers — distractingly transparent. Higher alpha + a stronger blur keep the backdrop image
showing through as soft colour without the content behind punching through. */
--glass-blur: 14px; --glass-blur: 14px;
--glass-saturate: 1.6; --glass-saturate: 1.6;
--glass-dark-bright: 1.2; --glass-dark-bright: 1.2;
+7
View File
@@ -14,6 +14,13 @@ export interface ReleaseEntry {
} }
export const RELEASE_NOTES: ReleaseEntry[] = [ export const RELEASE_NOTES: ReleaseEntry[] = [
{
version: "0.60.2",
date: "2026-08-08",
fixes: [
"Follow-up: made the frosted panels solid enough over a background image that the feed no longer shows through the sidebar and menus.",
],
},
{ {
version: "0.60.1", version: "0.60.1",
date: "2026-08-08", date: "2026-08-08",