refactor: accent colors

[Schwehn42]

Description

This PR refactors the accent colors. It's basically the second part to #4283, which changed all the color definitions.

Before

Previously, the two primary colors (light/dark) for each color was used to define the accent colors. For instance, using the classname accent-color__backlog-blue would yield the accent color --accent-color: $blue--500 (and accent-color--dark: $blue--400 respectively). On top of that, further CSS variables like --accent-color-desaturated-hover-dark were defined. The definitions were completely arbitrary and were used at own discretion instead of the actual design colors.

Furthermore, some designs use accent colors beyond 500 and 400, e.g. the new primary/secondary buttons. This actually motivated me to refactor this.

After

Now, not only the primary colors are used as accent colors, but all colors from the new schema are available. (e.g. --accent-color--300)
The primary colors are still easily accessible using shortcuts (--accent-color--light, --accent-color-dark).
Also, all shades are available as rgb, which means alpha channel can be applied.
"Excess" variables like the above mentioned desatured.. have been replaced with the new ones.

Changelog

• move colors to separate file
• add colors to map
• new mixins set-accent-variables and generate-accent-classes
  • generate accent variables for each color class (like backlog-blue)
  • shades from --accent-color--100 to --accent-color-800
  • shortcuts --accent-color--light and --accent-color--dark
  • split rgb version for each shade
  • remove excess accent variables
• use new accent colors in every file that requires them
• some manual adjustements (e.g. concerning note reactions) to fix some colors

Checklist

• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• The light- and dark-theme are both supported and tested
• The design was implemented and is responsive for all devices and screen sizes
• The application was tested in the most commonly used browsers (e.g. Chrome, Firefox, Safari)

(Optional) Visual Changes

[github-actions]

The deployment to the dev cluster was successful. You can find the deployment here: https://4304.development.scrumlr.fra.ics.inovex.io
This deployment is only for testing purposes and will be deleted after 1 week.
To redeploy rerun the workflow.
DO NOT STORE IMPORTANT DATA ON THIS DEPLOYMENT

Deployed Images

• ghcr.io/inovex/scrumlr.io/scrumlr-frontend:sha-74ea870

• ghcr.io/inovex/scrumlr.io/scrumlr-server:sha-74ea870

[octomind-dev]

🐙 Octomind

Test Report: 13/14 successful.

description	status	details
About Section Visibility Test	Passed ✅	click
change avatar	Passed ✅	click
check Privacy Policy	Passed ✅	click
check terms & conditions	Passed ✅	click
close cookie banner - front page	Passed ✅	click
close cookie banner - sign-in	Passed ✅	click
create and delete board columns	Failed ❌	click
create_and_delete_notes_and_actions_v2	Passed ✅	click
create lean coffee board	Passed ✅	click
edit_notes_and_actions_v5	Passed ✅	click
get started	Passed ✅	click
share_session	Passed ✅	click
sign-in	Passed ✅	click
test all ways to open the setup flow	Passed ✅	click

commit sha: 74ea870

[BenedictHomuth]

lgtm