Skip to content

CodeEditor - High contrast support #12383

Description

@logonoff

Is this a new component or an extension?

Enhancement to a current feature

Existing Component

CodeEditor

Describe the feature

Currently there is a isDarkTheme prop you can pass to CodeEditor to toggle the dark theme. I propose a isHighContrast prop to complement it, which would change the monaco theme to the builtin hc-light and hc-black depending on the state of isDarkMode

User Story

As a user who prefers-contrast: more, I want my entire UI to have a high contrast theme, including the code editor, so I can read the words better.

Visuals & Mockups

No response

Interaction States & Variations

Dark mode state Contrast state Monaco theme
light theme no high contrast pf-v6-theme-light
light theme high contrast hc-light
dark theme no high contrast pf-v6-theme-dark
dark theme high contrast hc-black

Accessibility (A11y)

No response

Product & Target Release

OCP 4.23

Contribution

  • I am interested in contributing this feature.

  • I have searched for similar existing requests.


Jira Issue: PF-4046

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Labels

No labels
No labels

Type

No type

Projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions