-
Notifications
You must be signed in to change notification settings - Fork 6
mobile: audit touch target sizes in bottom tabs #13
Copy link
Copy link
Open
Labels
accessibilityScreen-reader labels, touch targets, contrast, or keyboard flowScreen-reader labels, touch targets, contrast, or keyboard flowfirst-timers-onlyLowest-context starter task suitable for a first OSS PRLowest-context starter task suitable for a first OSS PRgood first issueSmall, low-context work suitable for a new contributorSmall, low-context work suitable for a new contributorhelp wantedMaintainer wants external contributors, not just internal follow-upMaintainer wants external contributors, not just internal follow-upmobileExpo/React Native UI, navigation, client API, mobile fixturesExpo/React Native UI, navigation, client API, mobile fixturestestsBackend pytest, mobile verify scripts, hygiene checksBackend pytest, mobile verify scripts, hygiene checksup-for-grabsScoped and available for external contributorsScoped and available for external contributors
Description
Metadata
Metadata
Assignees
Labels
accessibilityScreen-reader labels, touch targets, contrast, or keyboard flowScreen-reader labels, touch targets, contrast, or keyboard flowfirst-timers-onlyLowest-context starter task suitable for a first OSS PRLowest-context starter task suitable for a first OSS PRgood first issueSmall, low-context work suitable for a new contributorSmall, low-context work suitable for a new contributorhelp wantedMaintainer wants external contributors, not just internal follow-upMaintainer wants external contributors, not just internal follow-upmobileExpo/React Native UI, navigation, client API, mobile fixturesExpo/React Native UI, navigation, client API, mobile fixturestestsBackend pytest, mobile verify scripts, hygiene checksBackend pytest, mobile verify scripts, hygiene checksup-for-grabsScoped and available for external contributorsScoped and available for external contributors
Goal
Guarantee that all five bottom-navigation tabs expose a stable touch target of at least 48 logical pixels high. The target should remain large enough even if icon, font, or label metrics change later.
Where to work
apps/mobile/App.tsxaround theTABS.map(...)bottom-navigation buttonsapps/mobile/scripts/verify-frontend-regressions.mjsfor a focused regression guardSuggested scope
TouchableOpacityan explicitminHeight: 48(or an equivalent stable layout rule) while preserving the five equal-width tabs.hitSlop,accessibilityRole,accessibilityLabel, and selectedaccessibilityStatebehavior.npm run verify.Acceptance criteria
cd apps/mobile && npm run verifypasses.python3 scripts/check_public_tree.pypasses.Closes #13and briefly explains the accessibility benefit.Non-goals
Comment
/claimbefore starting so another contributor is not assigned the same first issue.