Drawer · family-drawer

내용에 맞춰 높이가 따라가는 드로어

animations.dev 랜딩의 Family Drawer 를 배포 번들에서 그대로 옮겼다. 드로어 높이는 내용물을 실측해서 0.27s · cubic-bezier(.25,1,.5,1) 로 따라가고, 내용은 같은 순간 popLayout 으로 갈아끼워진다. 두 트윈이 겹치는 게 이 인터랙션의 전부다.

옮기면서 잰 값

높이 트윈

0.27s · cubic-bezier(.25, 1, .5, 1)

기본 뷰 전환

0.22s · cubic-bezier(.26, .08, .25, 1)

상세 뷰 전환

0.27s · 같은 easing

Remove 뷰 퇴장

0.15s — 경고 화면만 유독 빠르게 뺀다

닫힌 뒤 뷰 복귀

300ms 지연