duct-tape2/ai-language-partner

mobile: audit touch target sizes in bottom tabs

Open

#13 opened on Jul 8, 2026

View on GitHub
 (1 comment) (0 reactions) (0 assignees)TypeScript (2 forks)auto 404
accessibilityfirst-timers-onlygood first issuehelp wantedmobiletestsup-for-grabs

Repository metrics

Stars
 (2 stars)
PR merge metrics
 (PR metrics pending)

Description

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.tsx around the TABS.map(...) bottom-navigation buttons
  • apps/mobile/scripts/verify-frontend-regressions.mjs for a focused regression guard

Suggested scope

  1. Give each bottom-tab TouchableOpacity an explicit minHeight: 48 (or an equivalent stable layout rule) while preserving the five equal-width tabs.
  2. Keep the existing hitSlop, accessibilityRole, accessibilityLabel, and selected accessibilityState behavior.
  3. Extend the frontend regression script so removing the minimum target-size guarantee fails npm run verify.

Acceptance criteria

  • Each of the five bottom tabs has a stable target height of at least 48 logical pixels.
  • Labels and icons remain centered and do not overlap at narrow mobile width.
  • Existing accessibility metadata remains intact.
  • cd apps/mobile && npm run verify passes.
  • python3 scripts/check_public_tree.py passes.
  • The PR body includes Closes #13 and briefly explains the accessibility benefit.

Non-goals

  • Do not replace the navigation architecture or redesign the tab bar.
  • Do not add screenshots, generated assets, local engines, or private files.

Comment /claim before starting so another contributor is not assigned the same first issue.

Contributor guide