feat(webapp): [mobile] round 1 — close the 761-900px breakpoint gap, touch-size controls

Designer round 1 scored layout 5 / readability 7 / tap-targets 6 /
navigation 8 / polish 7, one high finding:

- HIGH: tablet 768 and phone-landscape 844 fell between breakpoints —
  full desktop topbar + fixed 264px sidebar overflowed the page
  (scrollWidth 849 vs 768). The mobile media query now covers
  max-width 900px, giving those widths the off-canvas sidebar and
  collapsed topbar.
- MED: admin-row selects (28px) and .ai-btn/.ai-del (27px) bumped to
  40px targets on mobile, rows wrap; modal buttons to 44px; share
  dialog's destructive Revoke pushed away from Done; Escape now
  dismisses the share dialog.
- MED: <=430px drops the verbose .dl-meta so filenames stop truncating.
- LOW: gd-copy gets an opaque backing over scrolling code; compact
  nowrap history timestamps; invite/pbtn/palette rows to 44px.

42 e2e specs green.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01P5cxPQdSGJnjXCYY9GeWXt
This commit is contained in:
Snow Lee
2026-07-13 20:46:02 -07:00
co-authored by Claude Fable 5
parent 255800329c
commit 036faa149c
6 changed files with 46 additions and 11 deletions
+1
View File
@@ -79,6 +79,7 @@ spot-checked each round — no regressions introduced by mobile fixes.
| Round | layout | readability | tap-targets | navigation | polish | high-sev findings |
|---|---|---|---|---|---|---|
| 1 (before fixes) | 5 | 7 | 6 | 8 | 7 | 1 (topbar overflow at 768/844 — breakpoint gap) |
## Won't-fix / disputed