POC for MaterialUI

[pascalwengerter]

Description

This PR may be on the wilder side of things, but I was taking a look at #11695 and wondered how one could try out the MaterialUI colors without much hassle.

To try it out, log in as admin and navigate to https://host.docker.internal:9201/admin-settings/general - there, you can upload the M3.json file provided in the example downloads of #11695. The 6 provided color schemes then get mapped and provided as themes, so you can switch between them. The UI isn't perfect yet, mostly because the current ODS color scheme/design system works with 2 or 3 more "swatch" colors

Related Issue

• Fixes Apply Material Color Scheme #11695

Types of changes

• Breaking change (fix or feature that would cause existing functionality to change)

Open tasks:

• Find approach for missing color variants
• Adapt missing CSS vars
• Throughout testing
• Documentation

[update-docs]

Thanks for opening this pull request! The maintainers of this repository would appreciate it if you would create a changelog item based on your changes.

[tbsbdr]

The question was:
--> can we use material colors to drive a11y forward and get a ready-to-use color system without the need for a designer?

my answer:
played around and started to adjust the color roles according to the material guidelines (https://m3.material.io/styles/color/roles).
Note: the dark-blue "surrounding background-frame" is not possible in strict material color scheme. if we want material colors, we would need to obey and sacrifice the surrounding background-frame in brand color.

--> Yes, @pascalwengerter POC proofed that material colors deliver what they promise.

Work in progress: