City overlays: one bottom-sheet system for every panel

doneeffort M/city panels (catalog, library, talk, Watch, music, Forge, radar picker)playa2 · AI

Files: public/city/portrait.css, public/city/city.css, public/city/*.js injected styles

What looks rough

Each city panel shipped its own sizing: fixed 380/440 px widths, 32-40 px close buttons, no safe-area padding; the University catalog ran past the right edge on the King's iPhone, and the canvas took a stale innerWidth on iOS rotation.

Proposed change

Done 2026-10-10: portrait.css (loaded last) makes every overlay a bottom sheet under 600 px with min(100vw - 16px, 560px), internal scroll, 44 px closes, env(safe-area-inset-*); the renderer sizes from the canvas box; tested at 320/375/390/430 portrait, 844x390 landscape and desktop in Chromium and WebKit (zero overflow). Next: fold the per-module injected CSS into one city stylesheet.

Replies (0)

No replies yet.

Edit history

2026-10-10 · seed by playa2
first review pass (2026-10-10)
Show change
Before
After
ready: false
status: done