@kdcloudjs/kdesign 1.1.2 → 1.2.1

package/lib/switch/style/index.css

@@ -107,7 +107,7 @@
   display: inline-block;
   -webkit-box-sizing: border-box;
           box-sizing: border-box;
-  background-color: var(--kd-c-switch-color-off, #999);
+  background-color: var(--kd-c-switch-color-off, #B2B2B2);
   cursor: pointer;
   -webkit-transition: all calc(0.3s - 0.1s) cubic-bezier(0, 0.4, 0.4, 1);
   transition: all calc(0.3s - 0.1s) cubic-bezier(0, 0.4, 0.4, 1);
@@ -155,11 +155,11 @@
   vertical-align: baseline;
 }
 .kd-switch-disabled {
-  background-color: var(--kd-c-switch-color-background-disabled, var(--kd-g-color-disabled, #b2b2b2));
+  background-color: var(--kd-c-switch-color-off-background-disabled, #D9D9D9);
   cursor: not-allowed;
 }
 .kd-switch-checked {
-  background-color: var(--kd-c-switch-color-on, var(--kd-g-color-theme, #5582f3));
+  background-color: var(--kd-c-switch-color-on, var(--kd-g-color-theme-6, #5582f3));
   text-align: right;
 }
 .kd-switch-checked::after {
@@ -174,7 +174,7 @@
   color: var(--kd-c-switch-color-loading, var(--kd-g-color-ongoing, #276ff5));
 }
 .kd-switch-checked.kd-switch-disabled {
-  opacity: 0.5;
+  background-color: var(--kd-c-switch-color-on-background-disabled, var(--kd-g-color-theme-4, #b5cfff));
 }
 .kd-switch-checked .kd-switch-inner {
   margin: var(--kd-c-switch-inner-spacing-margin-checked, 0 17px 0 5px);
@@ -183,19 +183,19 @@
   margin: var(--kd-c-switch-inner-spacing-margin-large-checked, 0 21px 0 5px);
 }
 .kd-switch-size-small {
-  height: var(--kd-c-switch-small-sizing-height, 14px);
-  min-width: var(--kd-c-switch-small-sizing-width, 28px);
+  height: var(--kd-c-switch-small-sizing-height, 16px);
+  min-width: var(--kd-c-switch-small-sizing-width, 32px);
   line-height: var(--kd-c-switch-small-line-height, 14px);
   font-size: var(--kd-c-switch-small-font-size, var(--kd-g-font-size-small, 12px));
-  border-radius: var(--kd-c-switch-small-radius-border, 7px);
+  border-radius: var(--kd-c-switch-small-radius-border, 8px);
 }
 .kd-switch-size-small::after {
-  width: calc(var(--kd-c-switch-small-sizing-height, 14px) - 2px);
-  height: calc(var(--kd-c-switch-small-sizing-height, 14px) - 2px);
+  width: calc(var(--kd-c-switch-small-sizing-height, 16px) - 2px);
+  height: calc(var(--kd-c-switch-small-sizing-height, 16px) - 2px);
 }
 .kd-switch-size-small .kd-switch-loading-icon {
-  width: calc(var(--kd-c-switch-small-sizing-height, 14px) - 2px);
-  height: calc(var(--kd-c-switch-small-sizing-height, 14px) - 2px);
+  width: calc(var(--kd-c-switch-small-sizing-height, 16px) - 2px);
+  height: calc(var(--kd-c-switch-small-sizing-height, 16px) - 2px);
 }
 .kd-switch-size-large {
   height: var(--kd-c-switch-large-sizing-height, 20px);

package/lib/switch/style/index.less

@@ -32,7 +32,7 @@
   }
 
   &-disabled {
-    background-color: @switch-disabled-bg;
+    background-color: @switch-off-disabled-bg;
     cursor: not-allowed;
   }
 
@@ -53,7 +53,7 @@
     }
 
     &.@{switch-prefix-cls}-disabled {
-      opacity: 0.5;
+      background-color: @switch-on-disabled-bg;
     }
 
     .@{switch-prefix-cls}-inner {

package/lib/switch/style/token.less

@@ -2,11 +2,11 @@
 
 @switch-prefix: '--@{kd-prefix}-c-switch';
 
-
 // color
-@switch-on-color: var(~'@{switch-prefix}-color-on', @color-theme);
-@switch-off-color: var(~'@{switch-prefix}-color-off', #999);
-@switch-disabled-bg: var(~'@{switch-prefix}-color-background-disabled', @color-disabled);
+@switch-on-color: var(~'@{switch-prefix}-color-on', @color-theme-6);
+@switch-off-color: var(~'@{switch-prefix}-color-off', #B2B2B2);
+@switch-on-disabled-bg: var(~'@{switch-prefix}-color-on-background-disabled', @color-theme-4);
+@switch-off-disabled-bg: var(~'@{switch-prefix}-color-off-background-disabled', #D9D9D9);
 @switch-loading-color: var(~'@{switch-prefix}-color-loading', @color-ongoing);
 @switch-font-color: var(~'@{switch-prefix}-color-font', @color-white);
 
@@ -15,19 +15,16 @@
 @switch-large-font-size: var(~'@{switch-prefix}-large-font-size', @font-size-small);
 @switch-inner-small-font-size: var(~'@{switch-prefix}-inner-font-size-small', @font-size-small);
 
-
 // line-height
 @switch-large-line-height: var(~'@{switch-prefix}-large-line-height', 20px);
 @switch-small-line-height: var(~'@{switch-prefix}-small-line-height', 14px);
 
-
 //radius
-@switch-small-border-radius: var(~'@{switch-prefix}-small-radius-border', 7px);
-
+@switch-small-border-radius: var(~'@{switch-prefix}-small-radius-border', 8px);
 
 // sizing
-@switch-small-height: var(~'@{switch-prefix}-small-sizing-height', 14px);
-@switch-small-min-width: var(~'@{switch-prefix}-small-sizing-width', 28px);
+@switch-small-height: var(~'@{switch-prefix}-small-sizing-height', 16px);
+@switch-small-min-width: var(~'@{switch-prefix}-small-sizing-width', 32px);
 @switch-large-height: var(~'@{switch-prefix}-large-sizing-height', 20px);
 @switch-large-min-width: var(~'@{switch-prefix}-large-sizing-width', 40px);
 @switch-large-border-radius: var(~'@{switch-prefix}-large-sizing-border-radius', 10px);

package/lib/tag/style/index.css

@@ -245,32 +245,6 @@
   padding: 0;
   border-radius: 0;
 }
-.kd-tag-shape-text::before {
-  content: '';
-  display: block;
-  background-color: var(--kd-c-tag-color-process, var(--kd-g-color-ongoing, #276ff5));
-  border-radius: 50%;
-}
-.kd-tag-shape-text::before {
-  width: var(--kd-c-tag-spacing-padding-horizontal-small, 6px);
-  height: var(--kd-c-tag-spacing-padding-horizontal-small, 6px);
-  margin-right: var(--kd-c-tag-spacing-padding-horizontal-small, 6px);
-}
-.kd-tag-shape-text.kd-tag-size-small::before {
-  width: var(--kd-c-tag-spacing-padding-horizontal-small, 6px);
-  height: var(--kd-c-tag-spacing-padding-horizontal-small, 6px);
-  margin-right: var(--kd-c-tag-spacing-padding-horizontal-small, 6px);
-}
-.kd-tag-shape-text.kd-tag-size-middle::before {
-  width: var(--kd-c-tag-spacing-padding-horizontal-middle, 7px);
-  height: var(--kd-c-tag-spacing-padding-horizontal-middle, 7px);
-  margin-right: var(--kd-c-tag-spacing-padding-horizontal-middle, 7px);
-}
-.kd-tag-shape-text.kd-tag-size-large::before {
-  width: var(--kd-c-tag-spacing-padding-horizontal-large, 8px);
-  height: var(--kd-c-tag-spacing-padding-horizontal-large, 8px);
-  margin-right: var(--kd-c-tag-spacing-padding-horizontal-large, 8px);
-}
 .kd-tag-shape-text.kd-tag-process {
   color: var(--kd-c-tag-color-process, var(--kd-g-color-ongoing, #276ff5));
   display: -webkit-inline-box;
@@ -282,12 +256,6 @@
   padding: 0;
   border-radius: 0;
 }
-.kd-tag-shape-text.kd-tag-process::before {
-  content: '';
-  display: block;
-  background-color: var(--kd-c-tag-color-process, var(--kd-g-color-ongoing, #276ff5));
-  border-radius: 50%;
-}
 .kd-tag-shape-text.kd-tag-process.kd-tag-size-middle {
   color: var(--kd-c-tag-color-process, var(--kd-g-color-ongoing, #276ff5));
   display: -webkit-inline-box;
@@ -299,12 +267,6 @@
   padding: 0;
   border-radius: 0;
 }
-.kd-tag-shape-text.kd-tag-process.kd-tag-size-middle::before {
-  content: '';
-  display: block;
-  background-color: var(--kd-c-tag-color-process, var(--kd-g-color-ongoing, #276ff5));
-  border-radius: 50%;
-}
 .kd-tag-shape-text.kd-tag-process.kd-tag-size-large {
   color: var(--kd-c-tag-color-process, var(--kd-g-color-ongoing, #276ff5));
   display: -webkit-inline-box;
@@ -316,12 +278,6 @@
   padding: 0;
   border-radius: 0;
 }
-.kd-tag-shape-text.kd-tag-process.kd-tag-size-large::before {
-  content: '';
-  display: block;
-  background-color: var(--kd-c-tag-color-process, var(--kd-g-color-ongoing, #276ff5));
-  border-radius: 50%;
-}
 .kd-tag-shape-text.kd-tag-success {
   color: var(--kd-c-tag-color-success, var(--kd-g-color-success, #1ba854));
   display: -webkit-inline-box;
@@ -333,12 +289,6 @@
   padding: 0;
   border-radius: 0;
 }
-.kd-tag-shape-text.kd-tag-success::before {
-  content: '';
-  display: block;
-  background-color: var(--kd-c-tag-color-success, var(--kd-g-color-success, #1ba854));
-  border-radius: 50%;
-}
 .kd-tag-shape-text.kd-tag-success.kd-tag-size-middle {
   color: var(--kd-c-tag-color-success, var(--kd-g-color-success, #1ba854));
   display: -webkit-inline-box;
@@ -350,12 +300,6 @@
   padding: 0;
   border-radius: 0;
 }
-.kd-tag-shape-text.kd-tag-success.kd-tag-size-middle::before {
-  content: '';
-  display: block;
-  background-color: var(--kd-c-tag-color-success, var(--kd-g-color-success, #1ba854));
-  border-radius: 50%;
-}
 .kd-tag-shape-text.kd-tag-success.kd-tag-size-large {
   color: var(--kd-c-tag-color-success, var(--kd-g-color-success, #1ba854));
   display: -webkit-inline-box;
@@ -367,12 +311,6 @@
   padding: 0;
   border-radius: 0;
 }
-.kd-tag-shape-text.kd-tag-success.kd-tag-size-large::before {
-  content: '';
-  display: block;
-  background-color: var(--kd-c-tag-color-success, var(--kd-g-color-success, #1ba854));
-  border-radius: 50%;
-}
 .kd-tag-shape-text.kd-tag-warning {
   color: var(--kd-c-tag-color-warning, var(--kd-g-color-warning, #ff991c));
   display: -webkit-inline-box;
@@ -384,12 +322,6 @@
   padding: 0;
   border-radius: 0;
 }
-.kd-tag-shape-text.kd-tag-warning::before {
-  content: '';
-  display: block;
-  background-color: var(--kd-c-tag-color-warning, var(--kd-g-color-warning, #ff991c));
-  border-radius: 50%;
-}
 .kd-tag-shape-text.kd-tag-warning.kd-tag-size-middle {
   color: var(--kd-c-tag-color-warning, var(--kd-g-color-warning, #ff991c));
   display: -webkit-inline-box;
@@ -401,12 +333,6 @@
   padding: 0;
   border-radius: 0;
 }
-.kd-tag-shape-text.kd-tag-warning.kd-tag-size-middle::before {
-  content: '';
-  display: block;
-  background-color: var(--kd-c-tag-color-warning, var(--kd-g-color-warning, #ff991c));
-  border-radius: 50%;
-}
 .kd-tag-shape-text.kd-tag-warning.kd-tag-size-large {
   color: var(--kd-c-tag-color-warning, var(--kd-g-color-warning, #ff991c));
   display: -webkit-inline-box;
@@ -418,12 +344,6 @@
   padding: 0;
   border-radius: 0;
 }
-.kd-tag-shape-text.kd-tag-warning.kd-tag-size-large::before {
-  content: '';
-  display: block;
-  background-color: var(--kd-c-tag-color-warning, var(--kd-g-color-warning, #ff991c));
-  border-radius: 50%;
-}
 .kd-tag-shape-text.kd-tag-error {
   color: var(--kd-c-tag-color-error, var(--kd-g-color-error, #fb2323));
   display: -webkit-inline-box;
@@ -435,12 +355,6 @@
   padding: 0;
   border-radius: 0;
 }
-.kd-tag-shape-text.kd-tag-error::before {
-  content: '';
-  display: block;
-  background-color: var(--kd-c-tag-color-error, var(--kd-g-color-error, #fb2323));
-  border-radius: 50%;
-}
 .kd-tag-shape-text.kd-tag-error.kd-tag-size-middle {
   color: var(--kd-c-tag-color-error, var(--kd-g-color-error, #fb2323));
   display: -webkit-inline-box;
@@ -452,12 +366,6 @@
   padding: 0;
   border-radius: 0;
 }
-.kd-tag-shape-text.kd-tag-error.kd-tag-size-middle::before {
-  content: '';
-  display: block;
-  background-color: var(--kd-c-tag-color-error, var(--kd-g-color-error, #fb2323));
-  border-radius: 50%;
-}
 .kd-tag-shape-text.kd-tag-error.kd-tag-size-large {
   color: var(--kd-c-tag-color-error, var(--kd-g-color-error, #fb2323));
   display: -webkit-inline-box;
@@ -469,12 +377,6 @@
   padding: 0;
   border-radius: 0;
 }
-.kd-tag-shape-text.kd-tag-error.kd-tag-size-large::before {
-  content: '';
-  display: block;
-  background-color: var(--kd-c-tag-color-error, var(--kd-g-color-error, #fb2323));
-  border-radius: 50%;
-}
 .kd-tag-shape-text.kd-tag-end {
   color: var(--kd-c-tag-color-end, var(--kd-g-color-end, #666));
   display: -webkit-inline-box;
@@ -486,12 +388,6 @@
   padding: 0;
   border-radius: 0;
 }
-.kd-tag-shape-text.kd-tag-end::before {
-  content: '';
-  display: block;
-  background-color: var(--kd-c-tag-color-end, var(--kd-g-color-end, #666));
-  border-radius: 50%;
-}
 .kd-tag-shape-text.kd-tag-end.kd-tag-size-middle {
   color: var(--kd-c-tag-color-end, var(--kd-g-color-end, #666));
   display: -webkit-inline-box;
@@ -503,12 +399,6 @@
   padding: 0;
   border-radius: 0;
 }
-.kd-tag-shape-text.kd-tag-end.kd-tag-size-middle::before {
-  content: '';
-  display: block;
-  background-color: var(--kd-c-tag-color-end, var(--kd-g-color-end, #666));
-  border-radius: 50%;
-}
 .kd-tag-shape-text.kd-tag-end.kd-tag-size-large {
   color: var(--kd-c-tag-color-end, var(--kd-g-color-end, #666));
   display: -webkit-inline-box;
@@ -520,12 +410,6 @@
   padding: 0;
   border-radius: 0;
 }
-.kd-tag-shape-text.kd-tag-end.kd-tag-size-large::before {
-  content: '';
-  display: block;
-  background-color: var(--kd-c-tag-color-end, var(--kd-g-color-end, #666));
-  border-radius: 50%;
-}
 .kd-tag-shape-text.kd-tag-expired {
   color: var(--kd-c-tag-color-expired, var(--kd-g-color-disabled, #b2b2b2));
   display: -webkit-inline-box;
@@ -537,12 +421,6 @@
   padding: 0;
   border-radius: 0;
 }
-.kd-tag-shape-text.kd-tag-expired::before {
-  content: '';
-  display: block;
-  background-color: var(--kd-c-tag-color-expired, var(--kd-g-color-disabled, #b2b2b2));
-  border-radius: 50%;
-}
 .kd-tag-shape-text.kd-tag-expired.kd-tag-size-middle {
   color: var(--kd-c-tag-color-expired, var(--kd-g-color-disabled, #b2b2b2));
   display: -webkit-inline-box;
@@ -554,12 +432,6 @@
   padding: 0;
   border-radius: 0;
 }
-.kd-tag-shape-text.kd-tag-expired.kd-tag-size-middle::before {
-  content: '';
-  display: block;
-  background-color: var(--kd-c-tag-color-expired, var(--kd-g-color-disabled, #b2b2b2));
-  border-radius: 50%;
-}
 .kd-tag-shape-text.kd-tag-expired.kd-tag-size-large {
   color: var(--kd-c-tag-color-expired, var(--kd-g-color-disabled, #b2b2b2));
   display: -webkit-inline-box;
@@ -571,12 +443,6 @@
   padding: 0;
   border-radius: 0;
 }
-.kd-tag-shape-text.kd-tag-expired.kd-tag-size-large::before {
-  content: '';
-  display: block;
-  background-color: var(--kd-c-tag-color-expired, var(--kd-g-color-disabled, #b2b2b2));
-  border-radius: 50%;
-}
 .kd-tag-shape-edit {
   border: 1px solid var(--kd-c-tag-edit-color-border, var(--kd-g-color-text-placeholder, #ccc));
   border-radius: 2px;
@@ -589,11 +455,10 @@
   border-color: var(--kd-c-tag-edit-color-border-hover, var(--kd-g-color-theme, #5582f3));
 }
 .kd-tag-shape-edit:not(.kd-tag-closable-disabled):hover .kd-tag-closeWrapper {
-  background-color: var(--kd-c-tag-edit-cloesWrapper-color-background-hover, var(--kd-g-color-theme, #5582f3));
-  color: var(--kd-c-tag-edit-cloesWrapper-color-text-hover, var(--kd-g-color-white, #fff));
+  color: var(--kd-c-tag-edit-cloesWrapper-color-text-hover, var(--kd-g-color-theme, #5582f3));
 }
 .kd-tag-shape-edit.kd-tag-closable {
-  padding-right: 0;
+  padding-right: 8px;
 }
 .kd-tag-clickable {
   cursor: pointer;
@@ -613,24 +478,14 @@
 .kd-tag-closable.kd-tag-size-middle {
   line-height: var(--kd-c-tag-sizing-height-middle, 20px);
 }
-.kd-tag-closable.kd-tag-size-middle .kd-tag-closeWrapper {
-  width: calc(var(--kd-c-tag-sizing-height-middle, 20px) - 2px);
-  height: calc(var(--kd-c-tag-sizing-height-middle, 20px) - 2px);
-}
 .kd-tag-closable.kd-tag-size-large {
   line-height: var(--kd-c-tag-sizing-height-large, 24px);
   padding-left: var(--kd-c-tag-spacing-padding-horizontal-large, 8px);
 }
-.kd-tag-closable.kd-tag-size-large .kd-tag-closeWrapper {
-  width: calc(var(--kd-c-tag-sizing-height-large, 24px) - 2px);
-  height: calc(var(--kd-c-tag-sizing-height-large, 24px) - 2px);
-}
 .kd-tag-closable.kd-tag-size-large .kd-tag-closeWrapper .kd-tag-close-icon {
   font-size: 14px;
 }
 .kd-tag-closeWrapper {
-  width: calc(var(--kd-c-tag-sizing-height-middle, 20px) - 2px);
-  height: calc(var(--kd-c-tag-sizing-height-middle, 20px) - 2px);
   margin-left: 4px;
   display: -webkit-inline-box;
   display: -ms-inline-flexbox;

package/lib/tag/style/index.less

@@ -18,7 +18,7 @@
   &-size-large {
     .tag-size(@tag-large-font-size, @tag-large-height, @tag-large-padding-horizontal);
   }
-  
+
   transition: all @tag-g-motion-duration;
   // 状态标签
   &-shape-status {
@@ -42,16 +42,6 @@
   // 文本标签
   &-shape-text {
     .tag-text-color(@tag-process-color);
-    .tag-text-padding(@tag-small-padding-horizontal)
-  }
-  &-shape-text.@{tag-prefix-cls}-size-small {
-    .tag-text-padding(@tag-small-padding-horizontal)
-  }
-  &-shape-text.@{tag-prefix-cls}-size-middle {
-    .tag-text-padding(@tag-middle-padding-horizontal)
-  }
-  &-shape-text.@{tag-prefix-cls}-size-large {
-    .tag-text-padding(@tag-large-padding-horizontal)
   }
   each(@types, {
     &-shape-text.@{tag-prefix-cls}-@{value} {
@@ -76,13 +66,13 @@
     &:not(.@{tag-prefix-cls}-closable-disabled):hover {
       border-color: @tag-edit-g-color-border-hover;
       .@{tag-prefix-cls}-closeWrapper {
-        background-color: @tag-edit-cloesWrapper-g-color-background-hover;
+        // background-color: @tag-edit-cloesWrapper-g-color-background-hover;
         color: @tag-edit-cloesWrapper-g-text-color-hover;
       }
     }
 
     &.@{tag-prefix-cls}-closable {
-      padding-right: 0;
+      padding-right: 8px;
     }
   }
 
@@ -109,28 +99,18 @@
   }
   &-closable.@{tag-prefix-cls}-size-middle {
     line-height: @tag-middle-height;
-
-    .@{tag-prefix-cls}-closeWrapper {
-      width: calc(@tag-middle-height - 2px);
-      height: calc(@tag-middle-height - 2px);
-    }
   }
   &-closable.@{tag-prefix-cls}-size-large {
     line-height: @tag-large-height;
     padding-left: @tag-large-padding-horizontal;
 
     .@{tag-prefix-cls}-closeWrapper {
-      width: calc(@tag-large-height - 2px);
-      height: calc(@tag-large-height - 2px);
-      
       .@{tag-prefix-cls}-close-icon {
         font-size: 14px;
       }
     }
   }
   &-closeWrapper {
-    width: calc(@tag-middle-height - 2px);
-    height: calc(@tag-middle-height - 2px);
     margin-left: 4px;
     display: inline-flex;
     justify-content: center;
@@ -141,4 +121,4 @@
     cursor: pointer;
     font-size: 12px;
   }
-}
+}

package/lib/tag/style/mixin.less

@@ -29,17 +29,4 @@
   align-items: center;
   padding: 0;
   border-radius: 0;
-  &::before{
-    content: '';
-    display: block;
-    background-color: @color;
-    border-radius: 50%;
-  }
-}
-.tag-text-padding(@padding) {
-  &::before{
-    width: @padding;
-    height: @padding;
-    margin-right: @padding;
-  }
 }

package/lib/tag/style/token.less

@@ -15,7 +15,7 @@
 @tag-edit-g-text-color: var(~'@{tag-custom-prefix}-edit-color-text', @color-text-primary);
 @tag-edit-g-color-border-hover: var(~'@{tag-custom-prefix}-edit-color-border-hover', @color-theme);
 @tag-edit-cloesWrapper-g-color-background-hover: var(~'@{tag-custom-prefix}-edit-cloesWrapper-color-background-hover', @color-theme);
-@tag-edit-cloesWrapper-g-text-color-hover: var(~'@{tag-custom-prefix}-edit-cloesWrapper-color-text-hover', @color-white);
+@tag-edit-cloesWrapper-g-text-color-hover: var(~'@{tag-custom-prefix}-edit-cloesWrapper-color-text-hover', @color-theme);
 @tag-edit-g-color-background-disabled: var(~'@{tag-custom-prefix}-edit-color-background-disabled', @color-background-contain-disabled);
 @tag-edit-g-color-border-disabled: var(~'@{tag-custom-prefix}-edit-color-background-disabled', @color-border-strong);
 @tag-edit-g-text-color-disabled: var(~'@{tag-custom-prefix}-edit-color-text-disabled', @color-border-strong);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kdcloudjs/kdesign",
-  "version": "1.1.2",
+  "version": "1.2.1",
   "description": "KDesign 金蝶前端react 组件库",
   "title": "kdesign",
   "keywords": [