fix(insights): stop clipping the wellness ring glow on the detail card

The wellness detail card carried overflow:hidden (v1.15.12) to keep the
subtle bottom-leaning gradient inside the rounded corners. But the score
ring's drop-shadow bloom is a child of that card, so overflow:hidden also
clipped the glow at the card edge.

The gradient is the card's own background, which is already clipped to
border-radius without overflow:hidden — overflow only clips child boxes,
never a painted background. Drop overflow:hidden: the gradient stays
corner-clipped, the ring glow now renders uncut on all four sides.
This commit is contained in:
Marc-André Bombeck committed 2026-06-07 22:04:32 +02:00
1 parent b3de2ed358
commit 98cbb00c8f
1 file changed
+6 -1
+6 -1
View File
@@ -533,7 +533,12 @@
.wellness-detail-card {
--tile-hue: var(--dracula-purple);
position: relative;
overflow: hidden;
/* The bottom-leaning gradient below is the card's OWN `background`, which is
* already clipped to `border-radius` — a painted background never bleeds past
* the rounded corners regardless of `overflow`. We deliberately do NOT set
* `overflow: hidden`: the ring's drop-shadow bloom (`.wellness-ring-arc`) is a
* CHILD box, and `overflow: hidden` would clip that glow at the card edge. The
* gradient stays corner-clipped; the glow renders uncut on all four sides. */
background: linear-gradient(
180deg,
color-mix(in srgb, var(--tile-hue) 16%, var(--card)) 0%,