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
Jira Issue: PF-4046
Is this a new component or an extension?
Enhancement to a current feature
Existing Component
CodeEditor
Describe the feature
Currently there is a
isDarkThemeprop you can pass toCodeEditorto toggle the dark theme. I propose aisHighContrastprop to complement it, which would change the monaco theme to the builtinhc-lightandhc-blackdepending on the state ofisDarkModeUser 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
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