search

sirrus233 / twilight-imperium-helper

Game assistant for Twilight Imperium
1 stars 0 forks source link

Set input font size to 16px on focus (prevents mobile auto-zoom) #26

Closed chelseaSchmidt closed 2 months ago

chelseaSchmidt commented 2 months ago

Another thing that was bothering me, it's so disruptive when it zooms anytime I type 🥴

Apparently it's some sort of mobile browser standard for auto-zoom to occur when the font size of an input is < 16px. I couldn't find a non-controversial way to shut this off, and we don't have much real estate on a phone to increase the font size, so my middle ground was to increase the font size on focus (which is not unlike zooming I guess, but less intrusive).

I deployed this branch so I could test it, so the change is out there if you want to look!

chelseaSchmidt commented 2 months ago

@sirrus233 I'm glad you have an android so we can both test it, good to know this is just an iOS thing! Also shucks, if it looks like a bug then it looks like a bug, don't love that. I think I'll explore making the labels on the left side of the grid floating labels (https://mui.com/joy-ui/react-input/#floating-label) which should free up some horizontal room and allow us to increase the overall font-size. Will add it as an issue so I remember!