Description
Summary
Add a High-Contrast mode option to EUI.
Background
This effort was initiated as an exploratory spike by @cee-chen here.
The Shared UX team identified a concrete need for this, as a solution to address global contrast issues in Kibana.
Definition of Done
- High Contrast mode is available in EUI.
- High Contrast mode is opt-in and not enabled by default.
- High Contrast mode can be configured either on the top level provider, or on a nested provider to enable for only a portion of UI.
- In addition to the option of an binary on/off configuration, High Contrast mode can be configured to key off of the 'preferences-contrast' media query.
- High Contrast mode is supported by the Borealis theme.
- (Needs validation) High Contrast mode is supported by the Amsterdam theme.
- High Contrast mode's availability and usage is documented as a Beta feature for EUI.
Resources
- High contrast mode support #8232
- https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-contrast
- https://developer.mozilla.org/en-US/docs/Web/CSS/@media/forced-colors
- https://kilianvalkhof.com/2023/css-html/i-no-longer-understand-prefers-contrast/
Screenshots
Sub-issues
Metadata
Metadata
Assignees
Labels
No labels