Add light and dark mode colors for risk score ratings

Lorenz van Herwaardenrequested to merge
risk-score-colors into master

What does this MR do and why?

Add light and dark mode colors for Risk Score ratings

This adds CSS custom properties for risk score background, tile text, and gauge text colors. These are used in the total risk score and risk score by project components and have slightly different values in dark and light mode.

This makes sure the total risk score and risk score by project charts have consistent risk score colors that work in light and dark mode.

References

Related #581121 (closed)

Related #568094 (closed)

Screenshots or screen recordings

Before After
risk-score-light-before risk-score-light-after
risk-score-dark-before risk-score-dark-after
by-project-light-before by-project-light-after
by-project-dark-before by-project-dark-after

How to set up and validate locally

  1. Go to group level new security dashboard in a group with a couple projects

MR acceptance checklist

Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by Lorenz van Herwaarden

Merge request reports