refactor: color palette

[Schwehn42]

Description

Replaces old color palette with new one. This unifies the general theme of the frontend. Also, some adjustments to the theme colors have been made.

Changelog

New Colors

$blue--800: #002366
$blue--700: #003499
$blue--600: #0046cc
$blue--500: #0057ff primary light
$blue--400: #3379ff primary dark
$blue--300: #669aff
$blue--200: #99bcff
$blue--100: #ccddff

$pink--800: #66002a
$pink--700: #99003f
$pink--600: #cc0054
$pink--500: #ff0069 primary light
$pink--400: #ff3387 primary dark
$pink--300: #ff66a5
$pink--200: #ff99c3
$pink--100: #ffcce1

$purple--800: #500e66
$purple--700: #791599
$purple--600: #a11ccc
$purple--500: #c923ff primary light
$purple--400: #d44fff primary dark
$purple--300: #df7bff
$purple--200: #e9a7ff
$purple--100: #f4d3ff

$violet--800: #250062
$violet--700: #380094
$violet--600: #4a00c5
$violet--500: #5d00f6 primary light
$violet--400: #7d33f8 primary dark
$violet--300: #9e66fa
$violet--200: #be99fb
$violet--100: #dfccfd

$green--800: #0b5532
$green--700: #107f4c
$green--600: #16aa65
$green--500: #1bd47e primary light
$green--400: #49dd98 primary dark
$green--300: #76e5b2
$green--200: #a4eecb
$green--100: #d1f6e5

$yellow--800: #666200
$yellow--700: #999300
$yellow--600: #ccc400
$yellow--500: #fff500 primary light
$yellow--400: #fff733 primary dark
$yellow--300: #fff966
$yellow--200: #fffb99
$yellow--100: #fffdcc

$orange--800: #664300
$orange--700: #996500
$orange--600: #cc8600
$orange--500: #ffa800 primary light
$orange--400: #ffb933 primary dark
$orange--300: #ffcb66
$orange--200: #ffdc99
$orange--100: #ffeecc

$navy--900: #111111
$navy--800: #15171e
$navy--700: #232732
$navy--600: #292f3b
$navy--500: #303745
$navy--400: #373e4f
$navy--300: #454e63
$navy--200: #586073
$navy--100: #6a7182

$gray--800: #8f95a1
$gray--700: #a2a7b1
$gray--600: #b5b8c1
$gray--500: #dddfe3
$gray--400: #e9eaec
$gray--300: #eeeff1
$gray--200: #f4f4f6
$gray--100: #f9fafa
$gray--000: #ffffff

Color replacements

$color-white (#FFFFFF) -> $gray--000 (#FFFFFF)
$color-white-one (#F9FAFB) -> $gray--100 (#F9FAFA)
$color-white-two (#F6F5FB) -> $gray--200 (#F4F4F6)
$color-dark-one (#242C3D) -> $navy--600 (#292F3B)
$color-dark-two (#272F41) -> $navy--600 (#292F3B)
$color-lighter-gray (#EDEFF2) -> $gray--300 (#EEEFF1)
$color-light-gray (#C3C9D3) -> $gray--600 (#B5B8C1)
$color-middle-gray (#A3A6AA) -> $gray--700 (#A2A7B1)
$color-dark-gray (#859093) -> $gray--800 (#8F95A1)
$color-darker-gray (#4F5253) -> $navy--300 (#454E63)
$color-darkest-gray (#232323) -> $navy--700 (#232732)
$color-black (#111111) -> $navy--900 (#111111)
$color-dark-mode (#272F41) -> $navy--600 (#292F3B)
$color-dark-mode--disabled (#1B202D) -> $navy--700 (#232732)
$color-dark-mode-note (#313949) -> $navy--500 (#303745)
$color-dark-mode-note--hover (#3D4555) -> $navy--400 (#373E4F)
$menu-icon-background-color--dark (#333948) -> $navy--500 (#303745)
$tooltip-background-color--light (#D3DAF0) -> $blue--100 (#CCDDFF)
$tooltip-background-color--dark (#485064) -> $navy--300 (#454E63)
$color-progress-circle (#3C7FFF) -> $blue--400 (#3379FF)
$color-icon-light-blue (#9EBFFF) -> $blue--200 (#99BCFF)
$color-board-reaction-name--dark (#5A647D) -> $navy--200 (#586073)
$color-board-reaction-name-self--light (#0057FF) -> $blue--500 (#0057FF)
$color-board-reaction-name-self--dark (#6096FF) -> $blue--300 (#669AFF)

Theme colors

Theme colors like backlog-blue use the new colors with --500 for light and --400 for dark mode.
Changed Colors:

added

• yielding yellow
• alert amber

renamed

• grooming green -> goal green
• lean lilac -> value violet
• error red -> critical carmine

removed

• retro red

Backend

To accommodate the new theme colors, there have been some backend changes:

• color.go: change color constants
• DB: add migration file to change color enum

(Optional) Visual Changes

[octomind-dev]

🐙 Octomind

Test Report: 14/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	Passed ✅	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: dd68f9d

[BenedictHomuth]

lgtm

[github-actions]

The deployment to the dev cluster was successful. You can find the deployment here: https://4283.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-7c2c6e0

• ghcr.io/inovex/scrumlr.io/scrumlr-server:sha-7c2c6e0