From 64a1f0b8db55af07e0d63c9142e91020eb67f4c2 Mon Sep 17 00:00:00 2001 From: Lukas Date: Tue, 24 Mar 2026 23:19:10 +0100 Subject: [PATCH] Add mobile foundation: iOS zoom fix, safe area insets, row padding - Input base font 16px on mobile to prevent iOS Safari auto-zoom - Safe area insets for notched phones (top/bottom bars) - viewport-fit=cover to enable safe area env() values - Action bar flex-wrap for custom stat field overflow - Slightly increased row padding on mobile (py-3 sm:py-2) - Removed redundant font-size classes from Input usages Co-Authored-By: Claude Opus 4.6 (1M context) --- apps/web/index.html | 2 +- apps/web/src/App.tsx | 10 ++++++++-- apps/web/src/components/action-bar.tsx | 2 +- apps/web/src/components/combatant-row.tsx | 8 ++++---- apps/web/src/components/hp-adjust-popover.tsx | 2 +- apps/web/src/components/ui/input.tsx | 2 +- 6 files changed, 16 insertions(+), 10 deletions(-) diff --git a/apps/web/index.html b/apps/web/index.html index 3d2b83f..b156749 100644 --- a/apps/web/index.html +++ b/apps/web/index.html @@ -2,7 +2,7 @@ - + diff --git a/apps/web/src/App.tsx b/apps/web/src/App.tsx index cb63b5a..1ad84a3 100644 --- a/apps/web/src/App.tsx +++ b/apps/web/src/App.tsx @@ -46,7 +46,10 @@ export function App() {
{!!actionBarAnim.showTopBar && (
@@ -85,7 +88,10 @@ export function App() {
diff --git a/apps/web/src/components/combatant-row.tsx b/apps/web/src/components/combatant-row.tsx index 519b31f..c627e8d 100644 --- a/apps/web/src/components/combatant-row.tsx +++ b/apps/web/src/components/combatant-row.tsx @@ -157,7 +157,7 @@ function MaxHpDisplay({ inputMode="numeric" value={draft} placeholder="Max" - className="h-7 w-[7ch] text-center text-sm tabular-nums" + className="h-7 w-[7ch] text-center tabular-nums" onChange={(e) => setDraft(e.target.value)} onBlur={commit} onKeyDown={(e) => { @@ -272,7 +272,7 @@ function AcDisplay({ inputMode="numeric" value={draft} placeholder="AC" - className="h-7 w-[6ch] text-center text-sm tabular-nums" + className="h-7 w-[6ch] text-center tabular-nums" onChange={(e) => setDraft(e.target.value)} onBlur={commit} onKeyDown={(e) => { @@ -348,7 +348,7 @@ function InitiativeDisplay({ value={draft} placeholder="--" className={cn( - "h-7 w-full text-center text-sm tabular-nums", + "h-7 w-full text-center tabular-nums", dimmed && "opacity-50", )} onChange={(e) => setDraft(e.target.value)} @@ -520,7 +520,7 @@ export function CombatantRow({ isPulsing && "animate-concentration-pulse", )} > -
+
{/* Concentration */}