Fix timeline content dark mode rendering
What does this MR do and why?
Raised in #is-this-known Slack thread timeline content rendered light mode colors in dark mode for targeted links and internal notes.
This is due to changes in !165568 (merged) moving _timeline.scss
to a page bundle without updating color usage to use CSS custom properties.
Because page bundle stylesheets do not get generated for all modes (default and dark mode) they require CSS custom properties so that dark mode values are set correctly, see: https://docs.gitlab.com/ee/development/fe_guide/dark_mode.html#scss-variables-vs-css-custom-properties
MR acceptance checklist
Screenshots or screen recordings
Before | After |
---|---|
How to set up and validate locally
- View issuable content which contains notes e.g. Issue comments https://gdk.test:3443/flightjs/Flight/-/issues/33#note_1446
- Link to a specific comment, it should be blue
- Add an internal note, it should be orange
- It should work correctly in light and dark mode