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.

Sign up for GitHub

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

Jump to bottom

Search field is barely visible in mobile Safari #11276

Open
3 tasks done
pepelsbey opened this issue Jun 9, 2024 · 0 comments
Open
3 tasks done

Search field is barely visible in mobile Safari #11276

pepelsbey opened this issue Jun 9, 2024 · 0 comments
Labels
🐛 bug Something isn't working, or isn't working as expected effort: small This task is a small effort. frontend general frontend issues homepage mobile Issues affecting mobile devices and narrow viewports. p1 We will address this soon and will provide capacity from our team for it in the next few releases. regression

Comments

@pepelsbey
Copy link
Member

Summary

The search field on the main page doesn’t have a border around it and is hardly noticeable in mobile Safari.

URL

https://developer.mozilla.org/en-US/

Reproduction steps

  1. Go to MDN in Safari on iOS/iPadOS
  2. Look at the search bar
  3. Compare the rendering to the desktop Safari

Expected behavior

Border around the search field

Actual behavior

No border in mobile Safari

Device

Smartphone

Browser

Safari

Browser version

Stable

Operating system

iOS

Screenshot

Mobile

mobile-dark

mobile-light

tablet

Desktop

desktop

Anything else?

Default browser styles for form controls in mobile Safari are different from desktop browsers. The search field relies on the default border-style. Instead, it should explicitly set one.

Validations
@github-actions github-actions bot added the needs triage Triage needed by staff and/or partners. Automatically applied when an issue is opened. label Jun 9, 2024
@argl argl added 🐛 bug Something isn't working, or isn't working as expected p1 We will address this soon and will provide capacity from our team for it in the next few releases. frontend general frontend issues homepage regression effort: small This task is a small effort. needs triage Triage needed by staff and/or partners. Automatically applied when an issue is opened. and removed needs triage Triage needed by staff and/or partners. Automatically applied when an issue is opened. labels Jun 10, 2024
@caugner caugner added the mobile Issues affecting mobile devices and narrow viewports. label Jul 1, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🐛 bug Something isn't working, or isn't working as expected effort: small This task is a small effort. frontend general frontend issues homepage mobile Issues affecting mobile devices and narrow viewports. p1 We will address this soon and will provide capacity from our team for it in the next few releases. regression
3 participants
@argl @pepelsbey @caugner