Use consistent orange color for low severity
What does this MR do and why?
This MR aligns the orange color used for minor/low severity items. Some low severity items, like in the MR security report widget are already using the darker $orange-300
color. For some remaining items, it's been changed from $orange-200
to $orange-300
. This aligns with what the Pajamas design system has defined.
orange-200: #e9be74
orange-300: #d99530
Relates to #406609 (closed)
Screenshots or screen recordings
The before screenshots show a dark grey icon for the low severity icon because I identified this orange inconsistency due to the initial bug: no orange color was applied due to a refactor a while back. This is the orange that was used before for reference:
Before | After |
---|---|
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
![]() |
How to set up and validate locally
Go to various places in UI and see that low/minor severity color is fixed: not dark grey anymore but orange-300 #d99530
.
Places where color was broken:
- Group level security dashboard
- Vulnerability report (table and count)
- Vulnerabilities table in security tab for a pipeline
- Finding modal
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this MR.