Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: search bar auto zoom issue in mobile Safari browsers #178

Open
wants to merge 1 commit into
base: main
Choose a base branch
from

Conversation

csmalhi
Copy link
Contributor

@csmalhi csmalhi commented Sep 25, 2023

Issue: in Safari when you click on the mobile search bar (Search products...), it automatically zooms into the screen, causing the page to start scrolling left and right.

The fix: make the search bar input's font size 16px

Here is some context to the solution:
https://stackoverflow.com/a/16255670/22499350

New: IOS will still zoom, unless you use 16px on the input without the focus.
@media screen and (-webkit-min-device-pixel-ratio:0) {
select,
textarea,
input {
font-size: 16px;
}
}

@vercel
Copy link

vercel bot commented Sep 25, 2023

@csmalhi is attempting to deploy a commit to the medusajs Team on Vercel.

A member of the Team first needs to authorize it.

@csmalhi csmalhi force-pushed the fix/remove-mobile-search-bar-zoom-safari branch from 12946c4 to f62c413 Compare September 25, 2023 16:55
@csmalhi csmalhi changed the title Fix search bar auto zoom issue in mobile Safari browsers fix: search bar auto zoom issue in mobile Safari browsers Sep 25, 2023
@csmalhi csmalhi force-pushed the fix/remove-mobile-search-bar-zoom-safari branch from f62c413 to 75c7254 Compare September 28, 2023 01:23
@csmalhi csmalhi force-pushed the fix/remove-mobile-search-bar-zoom-safari branch from 75c7254 to aa412fc Compare September 28, 2023 01:25
@csmalhi
Copy link
Contributor Author

csmalhi commented Oct 30, 2023

This fixes a UI issue in iPhone browsers!

go tap on any input field and see how the screen zooms in and starts to scroll left and right

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant