뷰 트랜지션을 켜봤다가 다시 껐다

목록에서 글로 넘어갈 때 제목이 그대로 따라 올라가는 그림을 만들고 싶었다.

되긴 됐다

view-transition-name 을 목록의 제목과 상세의 h1 에 같은 이름으로 걸면 끝이다. 문제는 이름이 문서 안에서 유일해야 한다는 것 — 목록에 스무 개가 깔려 있으면 스무 개가 전부 다른 이름을 가져야 하고, 그 이름을 글 id 로 만들면 CSS 가 아니라 데이터가 된다.

껐다

• 아카이빙이 이 사이트의 첫 목적이고, 전환은 읽는 속도를 1ms 도 줄여 주지 않는다
• prefers-reduced-motion 분기까지 합치면 유지할 코드가 두 벌이 된다

대신 캐스케이드 레이어로 유틸리티 싸움을 끝냈다 에서 정리한 층 위에 얹을 수 있게 자리만 비워 뒀다. 언젠가 다시 켠다면 목록 → 상세 한 곳에만 건다.