fix(radio): kendo-theme-bootstrap radios should be consistent with bo…

…otstrap radios fixes telerik/kendo-ui-core#5719
telerik · Oct 20, 2020 · 71c0c0f · 71c0c0f
1 parent bca8369
commit 71c0c0f
Show file tree

Hide file tree

Showing 5 changed files with 20 additions and 12 deletions.
diff --git a/packages/bootstrap/scss/radio/_variables.scss b/packages/bootstrap/scss/radio/_variables.scss
@@ -1,9 +1,11 @@
 // Radio Buttons
-$radio-icon-size: 10px !default;
-$radio-size: $icon-size !default;
+$radio-size: map-get( $spacing, 4 ) !default;
 $radio-radius: 50% !default;
 $radio-border-width: 1px !default;
 $radio-line-height: calc(#{$radio-size} + #{$radio-border-width}) !default;
+
+$radio-icon-size: 6px !default;
+
 $radio-label-margin-x: 8px;
 
 $radio-bg: $checkbox-bg !default;
@@ -22,10 +24,10 @@ $radio-focused-border: $checkbox-focused-border !default;
 $radio-focused-shadow: $checkbox-focused-shadow !default;
 $radio-focused-checked-border: $checkbox-checked-border !default;
 $radio-focused-checked-shadow: $checkbox-focused-checked-shadow !default;
-$radio-disabled-bg: null !default;
+$radio-disabled-bg: $checkbox-disabled-bg !default;
 $radio-disabled-text: null !default;
 $radio-disabled-border: null !default;
-$radio-disabled-checked-bg: null !default;
+$radio-disabled-checked-bg: $checkbox-disabled-checked-bg !default;
 $radio-disabled-checked-text: null !default;
 $radio-disabled-checked-border: null !default;
 $radio-invalid-bg: null !default;

diff --git a/packages/classic/scss/radio/_variables.scss b/packages/classic/scss/radio/_variables.scss
@@ -1,9 +1,11 @@
 // Radio Buttons
-$radio-icon-size: 12px !default;
-$radio-size: $icon-size !default;
+$radio-size: map-get( $spacing, 4 ) !default;
 $radio-radius: 50% !default;
 $radio-border-width: 1px !default;
 $radio-line-height: calc(#{$radio-size} + #{$radio-border-width}) !default;
+
+$radio-icon-size: ( $radio-size / 2 ) !default;
+
 $radio-label-margin-x: 8px !default;
 
 $radio-bg: $checkbox-bg !default;

diff --git a/packages/default/scss/radio/_layout.scss b/packages/default/scss/radio/_layout.scss
@@ -19,8 +19,8 @@
 
     .k-radio::before {
         content: "";
-        width: $radio-size / 2;
-        height: $radio-size / 2;
+        width: $radio-icon-size;
+        height: $radio-icon-size;
         border-radius: 50%;
         background-color: currentColor;
         transform: scale(0) translate(-50%, -50%);

diff --git a/packages/default/scss/radio/_variables.scss b/packages/default/scss/radio/_variables.scss
@@ -1,9 +1,11 @@
 // Radio Buttons
-$radio-icon-size: 12px !default;
-$radio-size: $icon-size !default;
+$radio-size: map-get( $spacing, 4 ) !default;
 $radio-radius: 50% !default;
 $radio-border-width: 1px !default;
 $radio-line-height: calc(#{$radio-size} + #{$radio-border-width}) !default;
+
+$radio-icon-size: ( $radio-size / 2 ) !default;
+
 $radio-label-margin-x: 8px !default;
 
 $radio-bg: $checkbox-bg !default;

diff --git a/packages/material/scss/radio/_variables.scss b/packages/material/scss/radio/_variables.scss
@@ -1,9 +1,11 @@
 // Radio Buttons
-$radio-icon-size: 10px !default;
-$radio-size: 16px !default;
+$radio-size: map-get( $spacing, 4 ) !default;
 $radio-radius: 50% !default;
 $radio-border-width: 2px !default;
 $radio-line-height: calc(#{$radio-size} + #{$radio-border-width}) !default;
+
+$radio-icon-size: ( $radio-size / 2 ) !default;
+
 $radio-label-margin-x: 8px;
 
 $radio-bg: null !default;