jake/sofa
1
Fork 0
mirror of https://github.com/jakejarvis/sofa.git synced 2026-08-29 05:05:38 -04:00
Code Issues Packages Projects Releases Wiki Activity

refactor(native): replace hardcoded pixel font sizes with semantic Tailwind classes and add ScaledIcon

Browse Source 
Replace all `text-[Npx]` arbitrary size utilities with their nearest semantic Tailwind equivalents (`text-sm`, `text-base`, `text-xs`, `text-3xl`, etc.) across every component so text participates properly in the system font-scale pipeline.

Introduce a `ScaledIcon` component backed by a `useScaledSize` hook that multiplies a base icon size by the current font-scale factor, then replace every bare Tabler icon with `ScaledIcon` so icons grow and shrink in proportion with the surrounding text.

- Add `maxFontSizeMultiplier={1.0}` to badge and label text that must not reflow at large accessibility sizes (the "Admin" pill, type/rating chips, provider name labels, and the TMDB attribution line).
This commit is contained in:
jake
2026-03-16 12:46:55 -04:00
parent 923651a7ae
commit ed3fd54896
46 changed files with 340 additions and 137 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.vscode/settings.json
Vendored
+32 -1
View File
@@ -37,5 +37,36 @@
},
"[css]": {
"editor.defaultFormatter": "biomejs.biome"
}
},
"tailwindCSS.classAttributes": [
"class",
"className",
"headerClassName",
"contentContainerClassName",
"columnWrapperClassName",
"endFillColorClassName",
"imageClassName",
"tintColorClassName",
"ios_backgroundColorClassName",
"thumbColorClassName",
"trackColorOnClassName",
"trackColorOffClassName",
"selectionColorClassName",
"cursorColorClassName",
"underlineColorAndroidClassName",
"placeholderTextColorClassName",
"selectionHandleColorClassName",
"colorsClassName",
"progressBackgroundColorClassName",
"titleColorClassName",
"underlayColorClassName",
"colorClassName",
"backdropColorClassName",
"backgroundColorClassName",
"statusBarBackgroundColorClassName",
"drawerBackgroundColorClassName",
"ListFooterComponentClassName",
"ListHeaderComponentClassName"
],
"tailwindCSS.classFunctions": ["useResolveClassNames"]
}