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 for disabled Safari inputs #1707

Merged
merged 4 commits into from
Oct 27, 2021
Merged

Conversation

maximedegreve
Copy link
Contributor

@maximedegreve maximedegreve commented Oct 26, 2021

Description

In Safari the text has an opacity that makes the text barely readable.
The fix is to use-webkit-text-fill-color and opacity to set those styles.

This causes a bug in our developer token section on GitHub.
You can see in he screenshot below that in Safari the text is only slightly visible. You can barely see it but it's there.

image-3

This bug was reported in Slack

How to test this?

Snippet to test this 🐛

<input class="form-control" type="text" placeholder="Access token" aria-label="access token" disabled value="my token">

Before:
Screenshot 2021-10-26 at 18 52 22

After:
Screenshot 2021-10-26 at 18 52 17

Found this similar fix somewhere else: jgthms/bulma#2355

/cc @primer/css-reviewers

@changeset-bot
Copy link

changeset-bot bot commented Oct 26, 2021

🦋 Changeset detected

Latest commit: c3702a1

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@primer/css Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@maximedegreve maximedegreve marked this pull request as ready for review October 26, 2021 17:58
@maximedegreve maximedegreve requested a review from a team as a code owner October 26, 2021 17:58
Copy link
Contributor

@simurai simurai left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍

Just added a suggestion with short comments that it's a browser specific fix

src/forms/form-control.scss Outdated Show resolved Hide resolved
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants