54ec6fa582
전 레이어를 실측하고 지도를 design.md 에 남겼다.
히어로 배경 셰이더 흐름 필드 scroll() +56px 하강
히어로 글자 scroll() -88px 상승 (반대 방향)
파이프라인 게이트 씬 sticky 6단계 통과
단계명 — 0 고정
산출물 view() ±14px
재료·설치·프리플라이트 사진 fixed 0 — 원경
사례 사진 drift 0.4 이미지 높이의 28.6%
조판 종이 drift 0.25 -122px — 근경
재료 타일 view() ±26 / ±58px
프리플라이트 항목 view() 6 -> 10px
수치 없음 의도적 정지
세 깊이가 다 있다. 종이를 원경으로 두지 않은 것은 손에 닿는 거리의
재질이기 때문이다. 한 층(단계명·수치)은 고정이어야 기준이 생긴다.
모바일 390px 에서도 fixed 가 유지된다 — background-attachment 를 안 쓴 덕이다.
prefers-reduced-motion 에서는 게이트 씬이 시작하지 않고, 고정 배경은
absolute 로 돌아가며, view() 애니메이션이 전부 꺼진다.
최종 검사: 토큰 밖 색상 0 · radius 2종 · 100vh 0 · scroll 리스너 0 ·
하드코딩 웨이트 0 · 가로 스크롤 0(390/1440) · 테스트 22개 통과
|
||
|---|---|---|
| .. | ||
| site | ||