fix(registry): fix rendering artifacts in parallax-zoom/unzoom demos

- Increase --focus-scale from 8 to 9 — at scale 8 the card matched
  the viewport width exactly (240×8=1920), leaving zero tolerance for
  subpixel rounding. Scale 9 overshoots by 240px on each axis.

- Reduce grid gap from 40px to 24px — the 1040px grid in a 1080px
  viewport left only 20px of padding, causing bottom-row cards and
  their box-shadows to clip at the frame edge.

- Remove transform-style: preserve-3d from both snippets — no 3D
  transforms are used, and preserve-3d can cause compositing artifacts
  with overflow: hidden ancestors.

- Unzoom: set --pu-sibling-fade to 0 and drive sibling opacity via
  GSAP (starting at t=2.0s). Previously, CSS-driven opacity made cards
  70% visible when they first peeked into the viewport, creating
  colored strips at the frame edge during the reveal.

Co-authored-by: Kanyini <onebenson@gmail.com>
This commit is contained in:
Miguel Ángel
2026-05-22 19:09:30 -04:00
co-authored by Kanyini
parent 5637a48c4c
commit 15e92e2299
4 changed files with 17 additions and 9 deletions
@@ -26,7 +26,6 @@
--pu-sibling-push: 900px;
--pu-sibling-fade: 1;
position: relative;
transform-style: preserve-3d;
}
.parallax-unzoom-card {