element-plus 2.2.19 → 2.2.21

package/theme-chalk/src/cascader.scss

@@ -8,6 +8,7 @@
   @include set-component-css-var('cascader', $cascader);
 
   display: inline-block;
+  vertical-align: middle;
   position: relative;
   font-size: getCssVar('font-size', 'base');
   line-height: map.get($input-height, 'default');
@@ -21,6 +22,7 @@
   }
 
   .#{$namespace}-input {
+    display: flex;
     cursor: pointer;
 
     .#{$namespace}-input__inner {

package/theme-chalk/src/date-picker/picker.scss

@@ -111,6 +111,10 @@
     &::placeholder {
       color: getCssVar('text-color', 'placeholder');
     }
+
+    &::selection {
+      outline: none;
+    }
   }
 
   .#{$namespace}-range-separator {

package/theme-chalk/src/image-viewer.scss

@@ -46,6 +46,7 @@
   }
 
   @include e(canvas) {
+    position: static;
     width: 100%;
     height: 100%;
     display: flex;

package/theme-chalk/src/input-number.scss

@@ -6,7 +6,7 @@
 
 @include b(input-number) {
   position: relative;
-  display: inline-block;
+  display: inline-flex;
   width: map.get($input-number-width, 'default');
   line-height: #{map.get($input-height, 'default') - 2};
 

package/theme-chalk/src/loading.scss

@@ -11,8 +11,6 @@
 @include b(loading-parent) {
   @include m(relative) {
     position: relative !important;
-    pointer-events: none;
-    user-select: none;
   }
 
   @include m(hidden) {

package/theme-chalk/src/popover.scss

@@ -40,9 +40,18 @@
 
     @include when(dark) {
       @include set-css-var-value(
-        'popover-title-text-color',
+        ('popover', 'bg-color'),
+        var(#{getCssVarName('text-color', 'primary')})
+      );
+      @include set-css-var-value(
+        ('popover', 'border-color'),
+        var(#{getCssVarName('text-color', 'primary')})
+      );
+      @include set-css-var-value(
+        ('popover', 'title-text-color'),
         var(#{getCssVarName('bg-color')})
       );
+      color: getCssVar('bg-color');
     }
 
     &:focus:active,

package/theme-chalk/src/select-v2.scss

@@ -25,14 +25,15 @@ $input-inline-start: map.get($input-padding-horizontal, 'default') !default;
     display: flex;
     align-items: center;
     flex-wrap: wrap;
-
+    position: relative;
     box-sizing: border-box;
     cursor: pointer;
     padding: 1px 30px 1px 0;
     border: 1px solid getCssVar('border-color');
     border-radius: getCssVar('border-radius-base');
-    transition: border-color getCssVar('transition-duration-fast')
-      getCssVar('ease-in-out-bezier-function');
+    background-color: getCssVar('fill-color', 'blank');
+    transition: getCssVar('transition', 'duration');
+
     &:hover {
       border-color: getCssVar('text-color', 'placeholder');
     }
@@ -47,7 +48,7 @@ $input-inline-start: map.get($input-padding-horizontal, 'default') !default;
 
     @include when(hovering) {
       &:not(.is-focused) {
-        border-color: getCssVar('text-color', 'placeholder');
+        border-color: getCssVar('border-color-hover');
       }
     }
 
@@ -180,6 +181,7 @@ $input-inline-start: map.get($input-padding-horizontal, 'default') !default;
   #{$selector}__combobox-input {
     padding-right: 35px;
     display: block;
+    color: getCssVar('text-color', 'regular');
 
     &:focus {
       border-color: getCssVar('select-input-focus-border-color');
@@ -236,7 +238,7 @@ $input-inline-start: map.get($input-padding-horizontal, 'default') !default;
   @include e(caret) {
     color: getCssVar('select-input-color');
     font-size: getCssVar('select-input-font-size');
-    transition: transform getCssVar('transition-duration');
+    transition: getCssVar('transition', 'duration');
     transform: rotateZ(180deg);
     cursor: pointer;
 
@@ -259,6 +261,7 @@ $input-inline-start: map.get($input-padding-horizontal, 'default') !default;
 
     &.#{$namespace}-icon {
       height: inherit;
+
       svg {
         vertical-align: middle;
       }
@@ -273,15 +276,6 @@ $input-inline-start: map.get($input-padding-horizontal, 'default') !default;
     flex-wrap: wrap;
   }
 
-  @include e(wrapper) {
-    background-color: getCssVar('fill-color', 'blank');
-    border: 1px solid getCssVar('border-color');
-    border-radius: getCssVar('border-radius-base');
-    position: relative;
-    transition: all getCssVar('transition-duration')
-      getCssVar('ease-in-out-bezier-function');
-  }
-
   @include e(input-calculator) {
     left: 0;
     position: absolute;

package/theme-chalk/src/select.scss

@@ -13,6 +13,35 @@
   display: flex;
   align-items: center;
   flex-wrap: wrap;
+  cursor: pointer;
+
+  .#{$namespace}-tag {
+    box-sizing: border-box;
+    border-color: transparent;
+    margin: 2px 6px 2px 0;
+    &:last-child {
+      margin-right: 0;
+    }
+
+    .#{$namespace}-icon-close {
+      background-color: getCssVar('text-color', 'placeholder');
+      right: -7px;
+      top: 0;
+      color: $color-white;
+
+      &:hover {
+        background-color: getCssVar('text-color', 'secondary');
+      }
+
+      &::before {
+        display: block;
+        transform: translate(0, 0.5px);
+      }
+    }
+  }
+  .#{$namespace}-tag--info {
+    background-color: getCssVar('fill-color');
+  }
 }
 
 @include b(select) {
@@ -75,6 +104,10 @@
 
   .#{$namespace}-input__inner {
     cursor: pointer;
+
+    &::selection {
+      outline: none;
+    }
   }
 
   .#{$namespace}-input {
@@ -183,34 +216,4 @@
     height: inherit;
     display: flex;
   }
-
-  .#{$namespace}-select__tags {
-    .#{$namespace}-tag {
-      box-sizing: border-box;
-      border-color: transparent;
-      margin: 2px 6px 2px 0;
-      &:last-child {
-        margin-right: 0;
-      }
-
-      .#{$namespace}-icon-close {
-        background-color: getCssVar('text-color', 'placeholder');
-        right: -7px;
-        top: 0;
-        color: $color-white;
-
-        &:hover {
-          background-color: getCssVar('text-color', 'secondary');
-        }
-
-        &::before {
-          display: block;
-          transform: translate(0, 0.5px);
-        }
-      }
-    }
-    .#{$namespace}-tag--info {
-      background-color: getCssVar('fill-color');
-    }
-  }
 }

package/theme-chalk/src/slider.scss

@@ -165,6 +165,7 @@ $slider-height: map.merge(
       font-size: 14px;
       color: getCssVar('color-info');
       margin-top: 15px;
+      white-space: pre;
     }
   }