mirror of
https://github.com/MBombeck/HealthLog.git
synced 2026-11-07 12:22:03 +00:00
fix(insights): isolate hero glow from sticky section nav
The hero band's glow-purple box-shadow bled through the sticky section nav (bg-background/80 + backdrop-blur) so the nav painted with a faint purple cast on scroll. Add `isolate` to the hero container so the shadow stays z-trapped inside its own stacking context. Fixes Design-HIGH-4. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
1 parent
f9af100d9d
commit
346867b468
1 file changed
+6
-1
@@ -182,7 +182,12 @@ export function HeroStrip({
|
||||
data-slot="insights-hero-strip"
|
||||
className={cn(
|
||||
"hero-gradient glow-purple animate-insight-in",
|
||||
"relative overflow-hidden rounded-xl px-4 py-5 sm:px-6 sm:py-6",
|
||||
// `isolate` creates a new stacking context so the purple glow
|
||||
// box-shadow stays z-trapped inside the hero band — without
|
||||
// it the shadow bled through the sticky section nav below
|
||||
// (the nav uses bg-background/80 + backdrop-blur, which the
|
||||
// shadow leaked through).
|
||||
"relative isolate overflow-hidden rounded-xl px-4 py-5 sm:px-6 sm:py-6",
|
||||
)}
|
||||
>
|
||||
{/*
|
||||
|
||||
Reference in new issue
Block a user