Introduce new CSS var

Orange-OpenSource · Oct 5, 2023 · 49bd416 · 49bd416
1 parent 38b7f69
commit 49bd416
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 14 deletions.
diff --git a/scss/_root.scss b/scss/_root.scss
@@ -144,6 +144,7 @@
   --#{$prefix}disabled-color: #{$gray-500};
   --#{$prefix}placeholder-color: #{$gray-700};
   --#{$prefix}gray-tweak: #{$gray-900};
+  --#{$prefix}input-filter: #{$invert-filter};
   // ******* End additions for dark-mode
 }
 
@@ -220,6 +221,7 @@
     --#{$prefix}disabled-color: #{$gray-700};
     --#{$prefix}placeholder-color: #{$gray-600};
     --#{$prefix}gray-tweak: #{$gray-700};
+    --#{$prefix}input-filter: #{none};
     // ******* End additions for dark-mode
     // scss-docs-end root-dark-mode-vars
   }

diff --git a/scss/_variables.scss b/scss/_variables.scss
@@ -1161,6 +1161,7 @@ $form-check-input-checked-bg-color:       $component-active-bg !default;
 $form-check-input-checked-border-color:   $form-check-input-checked-bg-color !default;
 $form-check-input-checked-bg-image:       var(--#{$prefix}check-icon) !default;
 $form-check-input-disabled-color:         var(--#{$prefix}gray-tweak) !default; // Boosted mod
+$form-check-input-disabled-filter:        var(--#{$prefix}input-filter) !default; // Boosted mod
 $form-check-radio-checked-bg-image:       url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='2' fill='#{$form-check-input-checked-color}'/></svg>") !default;
 
 $form-check-input-indeterminate-color:          $form-check-input-checked-color !default;

diff --git a/scss/forms/_form-check.scss b/scss/forms/_form-check.scss
@@ -115,7 +115,7 @@
     &:checked,
     &[type="checkbox"]:indeterminate {
       background-color: $form-check-input-disabled-color;
-      filter: $invert-filter;
+      filter: $form-check-input-disabled-filter;
       border-color: $form-check-input-disabled-color;
     }
     // End mod
@@ -386,16 +386,3 @@
   }
   // End mod
 }
-
-@if $enable-dark-mode {
-  @include color-mode(dark) {
-    // Boosted mod
-    .form-check-input:disabled {
-      &:checked,
-      &[type="checkbox"]:indeterminate {
-        filter: none;
-      }
-    }
-    // End mod
-  }
-}