feat: cinematic backdrop bleed with vignette and bottom fade on detail pages

This commit is contained in:
MiTHRAL 2026-05-01 02:25:12 -04:00
parent 1c128fd902
commit 8d5e495be2

View file

@ -88,9 +88,25 @@ body::after {
}
/* Make background transparent ONLY on item pages to reveal the backdrop */
#itemDetailPage,
#itemDetailPage {
background-color: transparent !important;
}
.backgroundContainer.withBackdrop {
background-color: transparent !important;
filter: saturate(0.75) brightness(0.9);
}
/* Radial vignette + bottom fade: bleeds backdrop into obsidian base */
.backgroundContainer.withBackdrop::after {
content: "";
position: absolute;
inset: 0;
background:
radial-gradient(ellipse at center, transparent 20%, rgba(8, 9, 12, 0.65) 100%),
linear-gradient(to bottom, transparent 40%, #08090C 100%);
pointer-events: none;
z-index: 1;
}
/* Allow the body background to be "pushed back" when a backdrop is present */