Trim down the range of background colors for styling admin messages/alerts
At the moment, the user can choose between a wide range of background colors for the admin message/alert. The problem with that is the styling of the text inside. Links are only separated from the text by being underlined, certain font and background combinations lead to contracts that aren't high enough, so they cause accessibility problems.
Solution
Let's trim down the background colors that are available to choose from so that they match the background colors we intentd to use for alerts.
Things we need to do:
- update the styling of these alerts (create a component if it's not available yet)
- trim down the range of color options for aler backgrounds to:
- Danger:
$red-100
- Warning:
$orange-100
- Info:
$blue-100
- Tip:
$gray-100
- Success:
$green-100
- Danger:
- the link color is then always default blue
- the text color depends on the background chosen (we have corresponding font styles for all of the alert styles mentioned above—danger, warning, ...)