fix(GlassPanes): upgrade off flat SSR fallback after mount

YO
4mo ago
+22-8

GlassPanes evaluated reduced-motion and backdrop-filter support during render. Both are static-safe during SSR and the first client render (assume reduced motion + no backdrop-filter), and neither reliably re-evaluated after mount — so in the browser the panes stayed stuck on the flat, non-animated fallback: no frosting, no drift (they looked like a foggy static wash).

Fix: gate both behind a mounted flag set in an effect, so the client re-renders once with the real values and upgrades to frosted, animated glass. Also widened the slide drift (±4% → ±13%) so motion is actually perceptible, and reduced the blur range (8–26px → 4–12px) so panes read as crisp glass rather than fog.

Verified in a real browser (Next 16 / React 19): panes now render frosted (data-fallback=false, backdrop-filter present) and drift visibly.

https://claude.ai/code/session_01WNP6tiqg78cXb7i23ThmQU

Open in Devin Review

Summary by cubic

Fixes GlassPanes staying on the flat SSR fallback by re-checking reduced-motion and backdrop-filter after mount. Also adjusts drift and blur so panes read as crisp, moving glass.

  • Bug Fixes
    • Re-evaluate reduced-motion and backdrop-filter support after mount via a mounted flag, upgrading from the SSR-safe flat fallback to frosted, animated panes when supported.
    • Motion polish: widen drift to ±13%, reduce blur to 4–12px, and slightly increase vertical slide to improve visibility and clarity.