feat(harmony): add colors for checkboxes & radios

taskany-inc · Dec 25, 2023 · 19e4a1d · 19e4a1d
1 parent 5287773
commit 19e4a1d
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 0 deletions.
diff --git a/harmony/dark.css b/harmony/dark.css
@@ -136,6 +136,15 @@
     --status-failed: var(--danger-500);
     --status-finished: var(--primary-500);
     --status-in-progress: hsl(207 86% 65%);
+    --check-default: var(--gray-600);
+    --check-default-hover: var(--gray-500);
+    --check-default-disabled: var(--gray-800);
+    --check-checked: var(--blue-600);
+    --check-checked-hover: var(--blue-500);
+    --check-checked-disabled: var(--gray-800);
+    --check-outline: var(--gray-500);
+    --check-mark: var(--base-white);
+    --check-mark-disabled: var(--text-ghost);
 }
 
 html[data-theme="dark"] {
@@ -244,4 +253,14 @@ html[data-theme="dark"] {
     --status-failed: var(--danger-500);
     --status-finished: var(--primary-500);
     --status-in-progress: hsl(207 86% 65%);
+    --check-default: var(--gray-600);
+    --check-default-hover: var(--gray-500);
+    --check-default-disabled: var(--gray-800);
+    --check-checked: var(--blue-600);
+    --check-checked-hover: var(--blue-500);
+    --check-checked-disabled: var(--gray-800);
+    --check-outline: var(--gray-500);
+    --check-mark: var(--base-white);
+    --check-mark-disabled: var(--text-ghost);
+
 }
diff --git a/harmony/light.css b/harmony/light.css
@@ -104,6 +104,15 @@ html[data-theme="light"] {
     --status-failed: var(--danger-400);
     --status-finished: var(--primary-400);
     --status-in-progress: var(--blue-400);
+    --check-default: var(--gray-600);
+    --check-default-hover: var(--gray-500);
+    --check-default-disabled: var(--gray-800);
+    --check-checked: var(--blue-600);
+    --check-checked-hover: var(--blue-500);
+    --check-checked-disabled: var(--gray-800);
+    --check-outline: var(--gray-500);
+    --check-mark: var(--base-white);
+    --check-mark-disabled: var(--text-ghost);
 }
 
 @media (prefers-color-scheme: light) {
@@ -213,5 +222,14 @@ html[data-theme="light"] {
         --status-failed: var(--danger-400);
         --status-finished: var(--primary-400);
         --status-in-progress: var(--blue-400);
+        --check-default: var(--gray-600);
+        --check-default-hover: var(--gray-500);
+        --check-default-disabled: var(--gray-800);
+        --check-checked: var(--blue-600);
+        --check-checked-hover: var(--blue-500);
+        --check-checked-disabled: var(--gray-800);
+        --check-outline: var(--gray-500);
+        --check-mark: var(--base-white);
+        --check-mark-disabled: var(--text-ghost);
     }
 }