mirror of
https://github.com/tiennm99/dating.git
synced 2026-09-01 14:20:54 +00:00
tiennm99
b0cd86e07c
The GSAP tier was a net negative: entrance triggers were created before the
pins and without refreshPriority, so ScrollTrigger measured them before each
pin inserted its spacer and every scene's animation completed below the fold.
Film mode also collapsed the two-column editorial layout, because
`html.film-ready .film-scene{display:flex}` outranks `.section-grid`, and both
pins held scroll without playing anything.
Engine:
- Create pins first, with refreshPriority, so reveals measure against the real
document height.
- Replace the per-scene scrub with per-beat, non-reversing batches. Fixes tall
scenes a single trigger can never time, and stops beats — including the
closing CTAs — from sitting at opacity 0 while still in the tab order.
- Give both pins real work: the cold open scrubs a camera push-in and
dissolves its copy; the closing pin scrubs a decorative vignette only, never
content opacity.
- Slow the honesty scene deliberately, and restore the longer landing the
closing beat is meant to get.
- Route in-page links through Lenis so nav travel shares the film's easing.
Layout and craft:
- Stop clobbering `display`; grid scenes keep their columns in every tier.
- Request Fraunces as a weight range — 550 and 600 were both snapping to 650,
so h1, h2 and h3 rendered identically.
- Collapse the mobile header from three rows to one (254px to 73px) and drive
scroll-margin-top from the measured height, so anchor jumps stop landing
headings behind the bar.
- Un-hide the page if no motion engine claims it within 1200ms, so a slow CDN
no longer means a wordless first paint.
- Full-bleed header, per-tween will-change, no backdrop blur on phones, cached
scroll extent, preloaded opening frame.
Story:
- Three shapes for three registers in the sagging middle: a numbered package,
an unboxed vow, and a climax set quieter than anything around it.
- An end card after the appendix, carrying the freshness stamp out of the
pinned closing scene and repeating the one apply door at the true bottom.
- Dissolve the hero into the page instead of cutting to ivory.
Vietnamese copy is moved, not reworded; the end card's single new word is
marked for the owner. Verified at 1440x900, 390x844 and 320x640, both themes,
reduced motion, CDN blocked and engine blocked.
