Skip to content

FE: Use theme color definition for warning icon #1282

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

Open
wants to merge 1 commit into
base: main
Choose a base branch
from

Conversation

stklcode
Copy link

@stklcode stklcode commented Aug 20, 2025

  • Breaking change? (if so, please describe the impact and migration path for existing application instances)

What changes did you make? (Give an overview)

We already have a color definition warningIcon in our theme which is close to the hard-coded yellow color in the actual template <WarningIcon>. Use it for consistency and allow theming here.

The original theme color yellow[20] changes the icon from #F2C94C to #FFDD57 which is close, but drops the contrast ratio on white background from 1.58:1 to 1.33:1.
Introduce a darker version yellow[30] with #FFD439, so we get at least up to 1.42:1. See screenshots below for comparison.

Stumbled across this during #1108

Is there anything you'd like reviewers to focus on?

AFAIK the warning icon is only used in the header for outdated versions (see screenshot at the bottom of the attached image)

How Has This Been Tested? (put an "x" (case-sensitive!) next to an item)

  • No need to
  • Manually (please, describe, if necessary)
  • Unit checks
  • Integration checks
  • Covered by existing automation

Checklist (put an "x" (case-sensitive!) next to all the items, otherwise the build will fail)

  • I have performed a self-review of my own code
  • I have commented my code, particularly in hard-to-understand areas
  • I have made corresponding changes to the documentation (e.g. ENVIRONMENT VARIABLES)
  • My changes generate no new warnings (e.g. Sonar is happy)
  • I have added tests that prove my fix is effective or that my feature works
  • New and existing unit tests pass locally with my changes
  • Any dependent changes have been merged

Check out Contributing and Code of Conduct

A picture of a cute animal (not mandatory but encouraged)

44a45bc9-76ad-42fd-b4bd-9b142be39d0b

@stklcode stklcode requested a review from a team as a code owner August 20, 2025 07:49
@kapybro kapybro bot added status/triage Issues pending maintainers triage status/triage/manual Manual triage in progress status/triage/completed Automatic triage completed and removed status/triage Issues pending maintainers triage labels Aug 20, 2025
We already have a color definition `warningIcon` in our theme which is
close to the hard-coded yellow color in the actual template. Use it for
consistency and allow theming here.

For slightly better contrast on white background, we introduce a darker
yellow version and switch from yellow[20] to yellow[30].
@stklcode stklcode force-pushed the fe/warning-icon-theme branch from 5bc6f1c to 9b4ebd4 Compare August 20, 2025 08:19
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
status/triage/completed Automatic triage completed status/triage/manual Manual triage in progress
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant