Mobile directional header and reading surfaces
Base: f8daa5e6464f0958f0b13e411c74a34af9ba0a9f.
User-visible changes
- On Discover, Community, and Library, downward scrolling hides the header; upward scrolling reveals it. Stopping does not reveal it. A small directional threshold suppresses finger jitter and iOS elastic rebound.
- Search and account controls share one 220 ms slide. The old opacity timeline and mask over the controls are removed. The decorative lower gradient is background paint. The header retains its layout space, and reduced-motion preferences disable the animation.
- Community's navigation/canvas edge uses neutral slate instead of a brown tint. Wallpaper preferences remain supported.
- Library list, detail, and Favorites, plus own/public profile main pages, use the document reading surface from the initial HTML paint. The loading/footer fix remains intact. Account forms, editors, and bounded modal/review content retain their own scroll containers.
- Library detail resets once for a different story. Data updates and responsive child swaps no longer run competing resets. Old mobile shell snapshots migrate to the named document scroller. Rotation transfers the position to the replacement detail markup, including when orientation settling runs between the breakpoint and paint.
- Opening a preview from Profile keeps its normally absent mobile header absent.
Verification
- 67 targeted tests passed: directional motion and interaction guards, first-paint/bootstrap parity, canvas CSS, keyboard/resume behavior, Library rotation, saved-position migration, and Library layout boundaries.
- Full app suite: 754 of 758 passed. The four failures were reproduced on the unchanged base checkout: three
mobile-nav-drawer-layout.test.tsgeometry assertions andfeedback-controls.test.tsxfailing during PostHog import because its Node test globals omitlocation. pnpm build: passed (5/5 tasks).pnpm typecheck: passed (8/8 tasks).- Vite HTTP checks returned 200 for Discover, Community, Library detail, Profile, and public Profile; each served the early reading bootstrap and critical stylesheet.
- Independent review found and verified the orientation-transfer cancellation fix. No remaining confirmed blockers.
No local browser was opened, per AGENTS.md. DOM/CSS checks do not reproduce physical iPhone Safari's native toolbar compositor or establish subjective animation quality. Physical Safari checks still need to cover long-tab resume, cold refresh, repeated direction changes, reply typing/scrolling, and both portrait/landscape orientations.
Local command logs: C:/Users/jefra/.codex/visualizations/2026/09/09/mobile-directional-header/.
