mirror of
https://github.com/MBombeck/HealthLog.git
synced 2026-11-09 04:50:59 +00:00
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:
1 parent
b3de2ed358
commit
98cbb00c8f
1 file changed
+6
-1
+6
-1
@@ -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%,
|
||||
|
||||
Reference in new issue
Block a user