refactor(colors): better contrasts

This commit is contained in:
upsiflu 2025-01-09 15:01:26 +01:00
parent 4b97b88f8d
commit 2244d4d88a
1 changed files with 17 additions and 17 deletions

View File

@ -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;