From 2244d4d88a4ee9c291943806680d40eb436db567 Mon Sep 17 00:00:00 2001
From: upsiflu <upsiflu@gmail.com>
Date: Thu, 9 Jan 2025 15:01:26 +0100
Subject: [PATCH] refactor(colors): better contrasts

---
 front/src/style/colors.scss | 34 +++++++++++++++++-----------------
 1 file changed, 17 insertions(+), 17 deletions(-)

diff --git a/front/src/style/colors.scss b/front/src/style/colors.scss
index ce6cd1d72..c8449291a 100644
--- a/front/src/style/colors.scss
+++ b/front/src/style/colors.scss
@@ -427,11 +427,11 @@
 
   .blue {
     --color: var(--fw-pastel-blue-1);
-    --background-color: color-mix(in oklab, black 66%, var(--fw-pastel-blue-1));
+    --background-color: color-mix(in oklab, black 60%, var(--fw-pastel-blue-1));
     &.raised, .action>button {
-      --background-color: color-mix(in oklab, black 71%, var(--fw-pastel-blue-2));
-      --hover-background-color: color-mix(in oklab, black 71%, var(--fw-pastel-blue-3));
-      --active-background-color: color-mix(in oklab, black 71%, var(--fw-pastel-blue-4));
+      --background-color: color-mix(in oklab, black 65%, var(--fw-pastel-blue-2));
+      --hover-background-color: color-mix(in oklab, black 65%, var(--fw-pastel-blue-3));
+      --active-background-color: color-mix(in oklab, black 65%, var(--fw-pastel-blue-4));
       --disabled-color: var(--fw-gray-700);
       --disabled-border-color: var(--fw-gray-400);
       --disabled-background-color: transparent;
@@ -440,11 +440,11 @@
 
   .red {
     --color: var(--fw-pastel-red-1);
-    --background-color: color-mix(in oklab, black 66%, var(--fw-pastel-red-2));
+    --background-color: color-mix(in oklab, black 60%, var(--fw-pastel-red-2));
     &.raised, .action>button {
-      --background-color: color-mix(in oklab, black 71%, var(--fw-pastel-red-2));
-      --hover-background-color: color-mix(in oklab, black 71%, var(--fw-pastel-red-3));
-      --active-background-color: color-mix(in oklab, black 71%, var(--fw-pastel-red-4));
+      --background-color: color-mix(in oklab, black 65%, var(--fw-pastel-red-2));
+      --hover-background-color: color-mix(in oklab, black 65%, var(--fw-pastel-red-3));
+      --active-background-color: color-mix(in oklab, black 65%, var(--fw-pastel-red-4));
       --disabled-color: var(--fw-gray-700);
       --disabled-border-color: var(--fw-gray-400);
       --disabled-background-color: transparent;
@@ -453,7 +453,7 @@
 
   .purple {
     --color: var(--fw-gray-100);
-    --background-color: color-mix(in oklab, black 55%, var(--fw-pastel-purple-1));
+    --background-color: color-mix(in oklab, black 50%, var(--fw-pastel-purple-1));
     &.raised, .action>button {
       --background-color: color-mix(in oklab, black 61%, var(--fw-pastel-purple-2));
       --hover-background-color: color-mix(in oklab, black 66%, var(--fw-pastel-purple-3));
@@ -466,11 +466,11 @@
 
   .green {
     --color: var(--fw-pastel-green-1);
-    --background-color: color-mix(in oklab, black 66%, var(--fw-pastel-green-1));
+    --background-color: color-mix(in oklab, black 55%, var(--fw-pastel-green-1));
     &.raised, .action>button {
-      --background-color: color-mix(in oklab, black 71%, var(--fw-pastel-green-2));
-      --hover-background-color: color-mix(in oklab, black 71%, var(--fw-pastel-green-3));
-      --active-background-color: color-mix(in oklab, black 71%, var(--fw-pastel-green-4));
+      --background-color: color-mix(in oklab, black 60%, var(--fw-pastel-green-2));
+      --hover-background-color: color-mix(in oklab, black 60%, var(--fw-pastel-green-3));
+      --active-background-color: color-mix(in oklab, black 60%, var(--fw-pastel-green-4));
       --disabled-color: var(--fw-gray-700);
       --disabled-border-color: var(--fw-gray-400);
       --disabled-background-color: transparent;
@@ -479,11 +479,11 @@
 
   .yellow {
     --color: var(--fw-pastel-yellow-1);
-    --background-color: color-mix(in oklab, black 71%, var(--fw-pastel-yellow-1));
+    --background-color: color-mix(in oklab, black 53%, var(--fw-pastel-yellow-3));
     &.raised, .action>button {
-      --background-color: color-mix(in oklab, black 71%, var(--fw-pastel-yellow-2));
-      --hover-background-color: color-mix(in oklab, black 71%, var(--fw-pastel-yellow-3));
-      --active-background-color: color-mix(in oklab, black 71%, var(--fw-pastel-yellow-4));
+      --background-color: color-mix(in oklab, black 45%, var(--fw-pastel-yellow-3));
+      --hover-background-color: color-mix(in oklab, black 45%, var(--fw-pastel-yellow-2));
+      --active-background-color: color-mix(in oklab, black 45%, var(--fw-pastel-yellow-1));
       --disabled-color: var(--fw-gray-700);
       --disabled-border-color: var(--fw-gray-400);
       --disabled-background-color: transparent;