bkui-vue 0.0.1-beta.13 → 0.0.1-beta.132

package/lib/date-picker/date-picker.less

@@ -33,6 +33,7 @@
     border: 1px solid @light-gray;
     border-radius: 2px;
     outline: none;
+    box-sizing: border-box;
 
     &.only-bottom-border {
       border-color: transparent transparent @light-gray transparent;
@@ -79,12 +80,14 @@
 
   .clear-action {
     position: absolute;
-    top: 50%;
+    // transform: translateY(-50%);
+    top: 0;
+    // top: 50%;
     right: 10px;
+    padding: 5px 0;
     font-size: 14px;
     color: @light-gray;
     cursor: pointer;
-    transform: translateY(-50%);
 
     &:hover {
       color: @gray-color;

package/lib/date-picker/date-picker.variable.css

@@ -1,5 +1,6 @@
 :root {
   --bk-prefix: bk;
+  --popover-max-height: 216px;
   --primary-color: #3a84ff;
   --success-color: #2dcb56;
   --warning-color: #ff9c01;
@@ -8,6 +9,7 @@
   --gray-color: #979ba5;
   --light-gray: #c4c6cc;
   --white-color: white;
+  --whitesmoke-color: #fafbfd;
   --disable-color: #dcdee5;
   --font-size-base: 12px;
   --font-size-medium: 14px;
@@ -17,7 +19,7 @@
   --line-height-large: 18px;
   --component-size-small: 26px;
   --component-size-base: 32px;
-  --component-size-large: 38px;
+  --component-size-large: 40px;
   --border-width-base: 1px;
   --border-style-base: solid;
   --border-radius-base: 2px;
@@ -30,8 +32,9 @@
   --input-broder-radius: 3px;
   --input-shadow-color: #a3c5fd;
   --input-horizontal-padding: 10px;
-  --input-block-color: #f4f6fa;
-  --input-icon-size: var(--font-size-large);
+  --input-block-color: #f5f7fa;
+  --input-block-hover-color: #eaebf0;
+  --input-icon-size: var(--font-size-medium);
   --input-maxlength-color: #979ba5;
   --button-primary-hover-color: #5594fa;
   --button-danger-hover-color: #ff5656;
@@ -42,6 +45,8 @@
   --button-danger-active-color: #db2626;
   --button-success-active-color: #1ab943;
   --button-warning-active-color: #eb9000;
+  --button-selected-bg-color: #e1ecff;
+  --button-disabled-selected-bg-color: #f0f1f5;
   --fixed-navbar-background: #fff;
   --fixed-navbar-boxshadow-color: rgba(0, 0, 0, 0.1);
   --switch-default-color: #fff;
@@ -83,6 +88,17 @@
   --date-picker-disabled-bg: #fafbfd;
   --date-picker-dropdown-mb: 4px;
   --date-picker-dropdown-bg: #fff;
+  --table-bg-color: var(--white-color);
+  --table-border-color: #dcdee5;
+  --table-head-bg-color: #fafbfd;
+  --table-head-font-color: #313238;
+  --table-body-font-color: #575961;
+  --table-row-hover-bg-color: #f5f7fa;
+  --table-row-active-bg-color: #f0f1f5;
+  --cascader-panel-border-color: #dcdee5;
+  --cascader-panel-hover: #eaf3ff;
+  --cascader-panel-active: #f4f6fa;
+  --cascader-panel-disabled-bg: #fff;
 }
 .bk-date-picker {
   display: inline-block;
@@ -113,6 +129,7 @@
   border: 1px solid var(--light-gray);
   border-radius: 2px;
   outline: none;
+  box-sizing: border-box;
 }
 .bk-date-picker-rel .bk-date-picker-editor.only-bottom-border {
   border-color: transparent transparent var(--light-gray) transparent;
@@ -149,12 +166,12 @@
 }
 .bk-date-picker-rel .clear-action {
   position: absolute;
-  top: 50%;
+  top: 0;
   right: 10px;
+  padding: 5px 0;
   font-size: 14px;
   color: var(--light-gray);
   cursor: pointer;
-  transform: translateY(-50%);
 }
 .bk-date-picker-rel .clear-action:hover {
   color: var(--gray-color);