Remove hardcoded colors from frontend

[Isti01]

There are a lot of instances where gray.500 or gray.600 are used instead of the colors set in the style component

There should be a border color setting on the admin panel

[albi005]

How about adopting Google's material color system? https://m3.material.io/styles/color/system/overview

This would replace every color reference with a CSS variable, for example var(--md-sys-color-primary). These are the roles that are defined by default:

We could either set every color on the backend or let the clients generate them from a seed color and a style.

npm package: https://www.npmjs.com/package/@material/material-color-utilities

We could also have a page where admins can try out different seed colors like here or here