fix bordered checkbox and radio height

packages/theme-chalk/src/checkbox.scss

@@ -17,6 +17,9 @@
     padding: $--checkbox-bordered-padding;
     border-radius: $--border-radius-base;
     border: $--border-base;
+    box-sizing: border-box;
+    line-height: normal;
+    height: $--checkbox-bordered-height;
 
     &.is-checked {
       border-color: $--color-primary;
@@ -34,6 +37,7 @@
     &.el-checkbox--medium {
       padding: $--checkbox-bordered-medium-padding;
       border-radius: $--button-medium-border-radius;
+      height: $--checkbox-bordered-medium-height;
 
       .el-checkbox__label {
         line-height: 17px;
@@ -49,6 +53,7 @@
     &.el-checkbox--small {
       padding: $--checkbox-bordered-small-padding;
       border-radius: $--button-small-border-radius;
+      height: $--checkbox-bordered-small-height;
 
       .el-checkbox__label {
         line-height: 15px;
@@ -69,6 +74,7 @@
     &.el-checkbox--mini {
       padding: $--checkbox-bordered-mini-padding;
       border-radius: $--button-mini-border-radius;
+      height: $--checkbox-bordered-mini-height;
 
       .el-checkbox__label {
         line-height: 12px;

packages/theme-chalk/src/common/var.scss

@@ -137,16 +137,20 @@ $--checkbox-checked-icon-color: $--fill-base !default;
 
 $--checkbox-input-border-color-hover: $--color-primary !default;
 
+$--checkbox-bordered-height: 40px !default;
 $--checkbox-bordered-padding: 9px 20px 9px 10px !default;
 $--checkbox-bordered-medium-padding: 7px 20px 7px 10px !default;
-$--checkbox-bordered-small-padding: 3px 15px 7px 10px !default;
-$--checkbox-bordered-mini-padding: 1px 15px 5px 10px !default;
+$--checkbox-bordered-small-padding: 5px 15px 5px 10px !default;
+$--checkbox-bordered-mini-padding: 3px 15px 3px 10px !default;
 $--checkbox-bordered-medium-input-height: 14px !default;
 $--checkbox-bordered-medium-input-width: 14px !default;
+$--checkbox-bordered-medium-height: 36px !default;
 $--checkbox-bordered-small-input-height: 12px !default;
 $--checkbox-bordered-small-input-width: 12px !default;
+$--checkbox-bordered-small-height: 32px !default;
 $--checkbox-bordered-mini-input-height: 12px !default;
 $--checkbox-bordered-mini-input-width: 12px !default;
+$--checkbox-bordered-mini-height: 28px !default;
 
 $--checkbox-button-font-size: $--font-size-base !default;
 $--checkbox-button-checked-fill: $--color-primary !default;
@@ -183,16 +187,20 @@ $--radio-checked-icon-color: $--color-primary !default;
 
 $--radio-input-border-color-hover: $--color-primary !default;
 
-$--radio-bordered-padding: 10px 20px 10px 10px !default;
-$--radio-bordered-medium-padding: 8px 20px 8px 10px !default;
-$--radio-bordered-small-padding: 6px 15px 6px 10px !default;
-$--radio-bordered-mini-padding: 4px 15px 4px 10px !default;
+$--radio-bordered-height: 40px !default;
+$--radio-bordered-padding: 12px 20px 0 10px !default;
+$--radio-bordered-medium-padding: 10px 20px 0 10px !default;
+$--radio-bordered-small-padding: 8px 15px 0 10px !default;
+$--radio-bordered-mini-padding: 6px 15px 0 10px !default;
 $--radio-bordered-medium-input-height: 14px !default;
 $--radio-bordered-medium-input-width: 14px !default;
+$--radio-bordered-medium-height: 36px !default;
 $--radio-bordered-small-input-height: 12px !default;
 $--radio-bordered-small-input-width: 12px !default;
+$--radio-bordered-small-height: 32px !default;
 $--radio-bordered-mini-input-height: 12px !default;
 $--radio-bordered-mini-input-width: 12px !default;
+$--radio-bordered-mini-height: 28px !default;
 
 $--radio-button-font-size: $--font-size-base !default;
 $--radio-button-checked-fill: $--color-primary !default;

packages/theme-chalk/src/radio.scss

@@ -19,6 +19,8 @@
     padding: $--radio-bordered-padding;
     border-radius: $--border-radius-base;
     border: $--border-base;
+    box-sizing: border-box;
+    height: $--radio-bordered-height;
 
     &.is-checked {
       border-color: $--color-primary;
@@ -38,6 +40,7 @@
     &.is-bordered {
       padding: $--radio-bordered-medium-padding;
       border-radius: $--button-medium-border-radius;
+      height: $--radio-bordered-medium-height;
       .el-radio__label {
         font-size: $--button-medium-font-size;
       }
@@ -51,6 +54,7 @@
     &.is-bordered {
       padding: $--radio-bordered-small-padding;
       border-radius: $--button-small-border-radius;
+      height: $--radio-bordered-small-height;
       .el-radio__label {
         font-size: $--button-small-font-size;
       }
@@ -64,6 +68,7 @@
     &.is-bordered {
       padding: $--radio-bordered-mini-padding;
       border-radius: $--button-mini-border-radius;
+      height: $--radio-bordered-mini-height;
       .el-radio__label {
         font-size: $--button-mini-font-size;
       }