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

[a11y]: Even in disabled state, the text content should be visible. #16336

Closed
2 tasks done
Vinodbs opened this issue May 7, 2024 · 3 comments
Closed
2 tasks done

[a11y]: Even in disabled state, the text content should be visible. #16336

Vinodbs opened this issue May 7, 2024 · 3 comments

Comments

@Vinodbs
Copy link

Vinodbs commented May 7, 2024

Package

@carbon/react

Browser

Chrome

Operating System

MacOS

Package version

v1.50.0

React version

v17.0.2

Automated testing tool and ruleset

Manual

Assistive technology

No response

Description

All fields should have visible text lables for easy user understanding

Even in disabled state, the text content should be visible.

WCAG 2.1 Violation

No response

Reproduction/example

https://stackblitz.com/edit/github-lu2ax9?file=src%2FApp.jsx

Steps to reproduce

Run the code
Observe the color difference for the disabled input field

Code of Conduct

@guidari
Copy link
Contributor

guidari commented May 7, 2024

Hey @Vinodbs the Stackblitz is not working for me.

Screenshot 2024-05-07 at 10 53 07

@alisonjoseph
Copy link
Member

@Vinodbs Looks like your code sample is broken, however something to note is that disabled states are not subject to color contrast a11y rules. https://carbondesignsystem.com/elements/color/overview/#disabled

This might be what you were trying to show?

<TextInput
  placeholder="placeholder text"
  labelText="Text input label"
  disabled
/>

@thyhmdo
Copy link
Member

thyhmdo commented Jun 10, 2024

We purposely have the disabled state with low-contrast text. If you need this text to be readable, we recommend using the read-only state.

@thyhmdo thyhmdo closed this as not planned Won't fix, can't repro, duplicate, stale Jun 10, 2024
@github-project-automation github-project-automation bot moved this to ✅ Done in Design System Jun 10, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
Archived in project
Development

No branches or pull requests

4 participants