style: adding dark theme styles in checkbox (#1218)

Brisanet · Dec 3, 2024 · 59ae896 · 59ae896
1 parent 3c6a066
commit 59ae896
Showing 1 changed file with 57 additions and 0 deletions.
diff --git a/projects/ion/src/lib/checkbox/_checkbox.theme.scss b/projects/ion/src/lib/checkbox/_checkbox.theme.scss
@@ -56,9 +56,66 @@ $default: (
   ),
 );
 
+$dark: (
+  size: 16px,
+  margin: 4px,
+  border-radius: 4px,
+  enabled: (
+    background-color: transparent,
+    border-color: ion-theme(neutral-1),
+    hover: (
+      background-color: ion-theme(neutral-1),
+      shadow-color: ion-theme(primary-2),
+      border-color: ion-theme(primary-3),
+      icon-color: ion-theme(primary-2),
+    ),
+    active: (
+      background-color: ion-theme(primary-2),
+      border-color: ion-theme(primary-5),
+      icon-color: ion-theme(primary-1),
+    ),
+    checked: (
+      background-color: ion-theme(primary-6),
+      icon-color: ion-theme(primary-1),
+      hover-background-color: ion-theme(primary-5),
+      active-background-color: ion-theme(primary-7),
+    ),
+  ),
+  disabled: (
+    background-color: ion-theme(neutral-7),
+    border-color: ion-theme(neutral-3),
+    icon-color: ion-theme(neutral-3),
+    checked: (
+      background-color: ion-theme(neutral-6),
+      icon-color: ion-theme(neutral-3),
+    ),
+  ),
+  indeterminate: (
+    background-color: ion-theme(primary-6),
+    border-radius: 4px,
+    icon-color: ion-theme(primary-1),
+    hover: (
+      background-color: ion-theme(primary-5),
+      icon-color: ion-theme(primary-1),
+    ),
+    disabled: (
+      icon-color: ion-theme(neutral-3),
+    ),
+  ),
+  label: (
+    font-size: 14px,
+    line-height: 20px,
+    color: ion-theme(neutral-1),
+    disabled: (
+      text-color: ion-theme(neutral-3),
+    ),
+  ),
+);
+
 @include register-component(
   checkbox,
   (
     default: $default,
+    dark: $dark,
   )
 );