mirror of
https://github.com/MBombeck/HealthLog.git
synced 2026-11-11 13:52:20 +00:00
fix(nav): bottom-nav 5+More overflow protects 44px tap targets
The 7-item bottom nav collapsed each touch target to ~50 px wide on a 375 px viewport — only just-passing WCAG 2.5.5's 44 px floor and visibly cramped on iPhone-13-mini-class screens. The mobile audit (`.planning/phase-A5-mobile-findings.md`) recommended 5+More. Primary strip keeps the four most-used surfaces plus Insights: Home, Measurements, Mood, Medications, Insights. Targets and Achievements move into a Radix `<Sheet>` triggered by a sixth "More" entry. Order matches the v1.4.15 layout for the four core items so muscle memory holds. The More button mirrors the same `min-h-11 min-w-11` hit area; `aria-haspopup="dialog"` + `aria-expanded` keeps screen-reader behaviour tight; the sheet renders bottom-anchored with safe-area padding so the inner links stay reachable above the iPhone home indicator. Active styling lights the More entry whenever any of its overflow children is the current route, so the user always knows which strip-level link "owns" their position.
This commit is contained in:
1 parent
d2bda42a3b
commit
072eee6997
4 files changed
+213
-39
No files matched your search
+4
-1
@@ -169,7 +169,10 @@
|
||||
"sidebar": "Sidebar",
|
||||
"mainNavigation": "Hauptnavigation",
|
||||
"mobileNavigation": "Mobile Navigation",
|
||||
"loadingScreen": "Laden…"
|
||||
"loadingScreen": "Laden…",
|
||||
"more": "Mehr",
|
||||
"moreSheetTitle": "Mehr",
|
||||
"moreSheetDescription": "Seiten, die nicht in die untere Leiste passen."
|
||||
},
|
||||
"auth": {
|
||||
"login": "Anmelden",
|
||||
|
||||
+4
-1
@@ -169,7 +169,10 @@
|
||||
"sidebar": "Sidebar",
|
||||
"mainNavigation": "Main navigation",
|
||||
"mobileNavigation": "Mobile navigation",
|
||||
"loadingScreen": "Loading…"
|
||||
"loadingScreen": "Loading…",
|
||||
"more": "More",
|
||||
"moreSheetTitle": "More",
|
||||
"moreSheetDescription": "Pages that don't fit the bottom bar."
|
||||
},
|
||||
"auth": {
|
||||
"login": "Sign in",
|
||||
|
||||
Reference in new issue
Block a user