feat(webapp): [mobile] round 4 — pass (9/9/8/9/8), touch-size the last small controls

Designer round 4: all categories >=8, zero high or medium findings, all
seven round-3 fixes confirmed with measurements. Residual lows fixed for
the confirmation round: insights lens chips, guide tabs, and modal text
inputs to 44px on mobile; at <=430px the share dialog's destructive
Revoke takes its own row instead of sitting 9px from Done.

All responsive CSS on the same URLs — no mobile-specific routes.
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 21:34:39 -07:00
co-authored by Claude Fable 5
parent 3161fc73c9
commit 9ea07281f8
5 changed files with 10 additions and 3 deletions
+1
View File
@@ -82,6 +82,7 @@ spot-checked each round — no regressions introduced by mobile fixes.
| 1 (before fixes) | 5 | 7 | 6 | 8 | 7 | 1 (topbar overflow at 768/844 — breakpoint gap) |
| 2 (after round-1 fixes) | 9 | 8 | 8 | 9 | 8 | 0 (5 low cosmetics, fixed before round 3) |
| 3 (after low-fixes) | 6 | 6 | 7 | 9 | 6 | 1 (REGRESSION: URL rows collapsed by the wrap fix — streak reset, fixed for round 4) |
| 4 (after round-3 fixes) | 9 | 9 | 8 | 9 | 8 | 0 (4 lows: chips/tabs/modal-input heights + share row at 360, fixed before round 5) |
## Won't-fix / disputed
+6
View File
@@ -453,6 +453,9 @@ button, input, a.btn { font-family: inherit; }
blocks the height to hold it. */
.gd-code { min-height: 62px; padding-top: 12px; padding-bottom: 12px; }
.gd-copy { min-height: 44px; padding: 0 14px; }
.gd-tab { min-height: 44px; }
.in-lens-btn { min-height: 44px; padding: 0 14px; }
.modal-input { height: 44px; }
.modal-actions button { height: auto; min-height: 44px; }
.pbtn { height: auto; min-height: 44px; }
#palette-results li { height: auto; min-height: 44px; }
@@ -471,6 +474,9 @@ button, input, a.btn { font-family: inherit; }
.ai-tag { font-size: 11px; }
.htime { white-space: nowrap; font-size: 12px; }
.hline { flex-wrap: wrap; }
/* Four share-dialog buttons don't fit one row at 360 — the destructive
Revoke takes its own line rather than sitting 9px from Done. */
.modal-actions .ai-del { flex: 0 0 100%; }
}
/* ---- markdown reading view ---- */
File diff suppressed because one or more lines are too long
+2 -2
View File
@@ -5,8 +5,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>BearDrive</title>
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>&#128059;</text></svg>">
<script type="module" crossorigin src="/assets/index-bn5aUbcQ.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-C7SPFcXA.css">
<script type="module" crossorigin src="/assets/index-HiDpouLO.js"></script>
<link rel="stylesheet" crossorigin href="/assets/index-NuzuPESr.css">
</head>
<body>
<svg width="0" height="0" class="sprite" aria-hidden="true" focusable="false">