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

Safari's input[disabled] text is too faded #6673

Closed
1 of 2 tasks
1mku opened this issue Aug 14, 2020 · 1 comment · Fixed by #6680 or #9206
Closed
1 of 2 tasks

Safari's input[disabled] text is too faded #6673

1mku opened this issue Aug 14, 2020 · 1 comment · Fixed by #6680 or #9206

Comments

@1mku
Copy link

1mku commented Aug 14, 2020

What package(s) are you using?

  • carbon-components
  • carbon-components-react

Detailed description

Describe in detail the issue you're having.

Safari's input[disabled] text is too faded

Is this issue related to a specific component?

TextInput

What browser are you working in?

Safari Version 13.1.1
Chrome Version 83

What version of the Carbon Design System are you using?

7.17.0

What offering/product do you work on? Any pressing ship or release dates we
should be aware of?

Steps to reproduce the issue

<TextInput disabled value="value" labelText="Label text" />

Additional information

Similar issue jgthms/bulma#2355

It looks like one solution is patching:

.bx--text-input { -webkit-text-fill-color: currentcolor; }

Screen Shot 2020-08-14 at 15 54 32

@kubijo
Copy link
Contributor

kubijo commented Jul 15, 2021

I've updated to carbon-components-react@npm:7.39.0 and the same issue is still present in safari@14 (Tested in Big Sur)... @mkuschov is my colleague, so the same project ;-)

edit: I've fixed it locally for now by this:

.bx--text-input:disabled {
    -webkit-text-fill-color: $disabled-02;
}

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