DogStark / DogStark/PetChain-MobileApp

Implement dynamic font scaling support in `MedicationScreen.tsx`

Open
#614 1 comment 0 reactions 0 assignees View on GitHub
Frontend Stellar Wave
Dominant language
TypeScript
Stars
1
Forks
134
Avg merge
2d 9h
Merged PRs (30d)
27

Description

**Labels:** `frontend` `accessibility`

**Background**
`src/screens/MedicationScreen.tsx` (29 KB) uses fixed font sizes that do not respect the device's accessibility font size setting. Users who rely on large text cannot read medication instructions or dosage information.

**What "Done" Looks Like**
- Replace all fixed `fontSize` values with values from the theme that scale with `PixelRatio.getFontScale()`
- Cap maximum scaling at 1.5× to prevent layout breakage (document this decision)
- Test at system font size settings: Default, Large, Accessibility Extra Large
- Ensure all text remains readable and no layout overflow at maximum supported scale

Contributor guide

Open the contributing guide

Research direction

Start with src/screens/MedicationScreen.tsx and trace its theme references and fixed fontSize declarations. Exercise the screen at Default, Large, and Accessibility Extra Large system font settings, confirming that theme-based scaling is capped at 1.5×, text remains readable, and no layout overflow occurs.

Written by the indexing model from the issue text.

Assessment

Tech stack
react-native, typescript
Domain
accessibility, frontend, mobile
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Quiet
Clarity
Clearly specified
Newbie friendliness
68/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.