Merge branch '13.1.x' into VDyulgerov/fix-columnToggle-event

IgniteUI · Mar 11, 2022 · 3567d35 · 3567d35
2 parents 63e64fc + b0be138
commit 3567d35
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 19 deletions.
diff --git a/projects/igniteui-angular/src/lib/core/styles/components/checkbox/_checkbox-theme.scss b/projects/igniteui-angular/src/lib/core/styles/components/checkbox/_checkbox-theme.scss
@@ -103,7 +103,7 @@
     // If updating the WIDTH of the checkbox here, please update it in the grid theme as well.
     // It is under the name of $cbx-size
     $size: em(20px);
-    $size-bs: em(14px);
+    $size-bs: em(16px);
     $checkbox-radius: math.div($size, 2);
 
     $variant: map.get($theme, variant);
@@ -229,31 +229,19 @@
         background: transparent;
 
         @if $bootstrap-theme {
-            %cbx-composite-mark {
-                stroke: var-get($theme, 'empty-color');
-            }
+            border-color: var-get($theme, 'disabled-color-label');
         }
     }
 
     %cbx-composite--x--disabled {
-        @if $bootstrap-theme {
-            background: transparent;
-        } @else {
-            background: var-get($theme, 'disabled-color');
-        }
+        background: var-get($theme, 'disabled-color');
 
         &::after {
-            @if $bootstrap-theme {
-                background: transparent;
-            } @else {
-                background: var-get($theme, 'disabled-color');
-            }
+            background: var-get($theme, 'disabled-color');
         }
 
         @if $bootstrap-theme {
-            %cbx-composite-mark--x {
-                stroke: var-get($theme, 'empty-color');
-            }
+            border-color: var-get($theme, 'disabled-color');
         }
     }
 

diff --git a/projects/igniteui-angular/src/lib/core/styles/themes/schemas/light/_checkbox.scss b/projects/igniteui-angular/src/lib/core/styles/themes/schemas/light/_checkbox.scss
@@ -92,7 +92,7 @@ $fluent-checkbox: extend(
 /// @type {Map}
 /// @prop {Map} fill-color [color: ('primary', 500)] - The checked border and fill colors.
 /// @prop {Map} empty-color [color: ('grays', 500)] - The unchecked border color.
-/// @prop {Map} disabled-color [color: ('grays', 300)] - The disabled border and fill colors.
+/// @prop {Map} disabled-color [color: ('primary', 200)] - The disabled border and fill colors.
 /// @prop {Number} border-radius [4px] - The border radius used for checkbox. Can be a fraction between 0 and 1, pixels, or percent.
 /// @prop {Number} border-radius-ripple [4px] - The border radius used for checkbox ripple. Can be a fraction between 0 and 1, pixels, or percent.
 /// @property {Map} focus-outline-color [color: ('primary', 200)] - The focus outlined color.
@@ -119,7 +119,7 @@ $bootstrap-checkbox: extend(
         ),
 
         disabled-color: (
-            color: ('grays', 300)
+            color: ('primary', 200)
         ),
     )
 );