SAP / ui5-webcomponents-react

A wrapper implementation for React of the UI5 Web Components that are compliant with the SAP Fiori User Experience
https://sap.github.io/ui5-webcomponents-react/
Apache License 2.0
435 stars 97 forks source link

[ObjectStatus]: A11y-ObjectStatus fails to meet 4:5:1 contrast ratio #5079

Closed caroline-ferri closed 11 months ago

caroline-ferri commented 12 months ago

Describe the bug

[ObjectStatus]: Inverted Object status with ValueState.Error has a contrast ratio of 3:9:1, failing to meet the expected 4:5:1 contrast ratio.

Isolated Example

https://sap.github.io/ui5-webcomponents-react/?path=/story/data-display-objectstatus--inverted

Reproduction steps

  1. examine the foreground color for the ValueState.Error ObjectStatus object
  2. examine the background color for the ValueState.Error ObjectStatus object
  3. compute the color contrast ratio ...

Expected Behaviour

Expected ratio should be at least 4:5:1.

Screenshots or Videos

Screenshot 2023-09-20 at 2 20 15 PM

UI5 Web Components for React Version

1.17.0

UI5 Web Components Version

ObjectStatus

Browser

Chrome

Operating System

Mac OS

Additional Context

No response

Relevant log output

No response

Declaration

Lukas742 commented 12 months ago

The design specs of the ObjectStatus where updated, unfortunately we now have to wait before we can implement them for the theming-base-content version to be updated.

Lukas742 commented 11 months ago

Hi @I585157

after applying the new variables I noticed that the colors for the inverted ValueState.Error didn't change, so this seems to be implemented by design. Please also note that a text-shadow is used here to increase contrast-ratio and readability. If you want to challenge that, please reach out to our design and a11y experts. You can contact me internally if you need contact information.

Since we are using the official CSS variables, I will close this issue now. If there are any further developments on this topic, please feel free to comment here.

github-actions[bot] commented 11 months ago

:tada: This issue has been resolved in version v1.21.0 :tada:

The release is available on v1.21.0

Your semantic-release bot :package::rocket: