Fix Safari Bugs on iOS

[nik-dange]

Info

There were some iOS Safari annoyances

• For the input to check in to an event, the text would autocorrect/autocomplete
• On iOS, the default behavior is to zoom in to a text input, but it doesn't zoom out afterwards

Changes

• Some css and a few attributes for the input tag

Type of Change

• Bug Fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as
  expected)
• Logistics Change (A change to a README, description, or dev workflow setup like
  linting/formatting)
• Continuous Integration Change (Related to deployment steps or continuous integration
  workflows)
• Other: (Fill In)

Testing

I have tested that my changes fully resolve the linked issue ...

• locally on Desktop.
• on the live deployment preview on Desktop.
• on the live deployment preview on Mobile.
• I have added new Cypress tests that are passing.

Checklist

• I have performed a self-review of my own code.
• I have followed the style guidelines of this project.
• [] I have documented any new functions in /src/lib/* and commented hard to understand areas
  anywhere else.
• My changes produce no new warnings.

Screenshots

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
membership-portal-ui-v2	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	May 14, 2024 1:56am
testing-membership-portal-ui-v2	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	May 14, 2024 1:56am

[nik-dange]

I found this post explaining the zooming in on Safari: https://stackoverflow.com/questions/2989263/disable-auto-zoom-in-input-text-tag-safari-on-iphone

Per the post, I hardcoded a 16px font size for mobile, and it looks like this:

As compared to the 0.75rem that was there initially:

Lowkey I think 16px looks better but idk if it's ok to hardcode this. There was talk in the SO post of using @supports (-webkit-touch-callout: none) but I tried it and it didn't work, not sure if I was using it right.

[alexzhang1618]

lgtm