Compute colors based on dark/light mode for severity chart

What does this MR do and why?

Due to this bug we can't provide CSS custom properties to echarts as a color and let it handle the dark/light mode automatically. Since we've introduced dark mode specific colors for severities in Support vulnerability severity colors in dark mode (!214138 - merged), it would be nice if they can be applied correctly to our Vulnerabilities over time chart.

This MR uses the following approach for the vulnerabilities over time chart:

• we need to get the actual color value from the CSS custom property
• getSeverityColors() iterates over the severity levels and gets the color value from the CSS custom property
• listenSystemColorSchemeChange and removeListenerSystemColorSchemeChange allow us to add and remove an eventlistener for light/dark mode changes and recompute the colors in that case.
• The actual hex color for the severity is given to echarts

References

Related #581121 (closed)

Screenshots or screen recordings

severity-colors-chart

How to set up and validate locally

1. Enable group security dashboard: http://gdk.test:3000/rails/features/group_security_dashboard_new
2. Run in SAAS mode: In your GDK root directory, open your env.runit file and set export GITLAB_SIMULATE_SAAS=1.
3. Go to a group with vulnerabilities, Secure > Security Dashboard
4. Use dark and light mode to check the colors of the Vulnerabilities over time chart

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.