element-plus 2.0.5 → 2.1.1

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

@@ -29,7 +29,7 @@ $input-inline-start: map.get($input-padding-horizontal, 'default') !default;
     box-sizing: border-box;
     cursor: pointer;
     padding: 1px 30px 1px 0;
-    border: 1px solid var(--el-border-color-base);
+    border: 1px solid getCssVar('border-color');
     border-radius: var(--el-border-radius-base);
     transition: border-color var(--el-transition-duration-fast)
       var(--el-ease-in-out-bezier-function);
@@ -54,7 +54,7 @@ $input-inline-start: map.get($input-padding-horizontal, 'default') !default;
     @include when(disabled) {
       cursor: not-allowed;
 
-      background-color: var(--el-bg-color);
+      background-color: getCssVar('fill-color', 'light');
       color: var(--el-text-color-placeholder);
       border-color: var(--el-select-disabled-border);
 

package/theme-chalk/src/select.scss

@@ -24,9 +24,20 @@
     );
   }
 
+  .#{$namespace}-select-tags-wrapper {
+    &.has-prefix {
+      margin-left: map.get($select-tags-prefix-padding, 'default');
+    }
+  }
+
   @each $size in (large, small) {
     @include m($size) {
       line-height: map.get($input-height, $size);
+      .#{$namespace}-select-tags-wrapper {
+        &.has-prefix {
+          margin-left: map.get($select-tags-prefix-padding, $size);
+        }
+      }
     }
   }
 
@@ -148,6 +159,20 @@
     flex-wrap: wrap;
   }
 
+  @include e(collapse-tags) {
+    white-space: normal;
+    z-index: var(--el-index-normal);
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+  }
+
+  @include e(collapse-tag) {
+    line-height: inherit;
+    height: inherit;
+    display: flex;
+  }
+
   .#{$namespace}-select__tags {
     .#{$namespace}-tag {
       box-sizing: border-box;

package/theme-chalk/src/slider.scss

@@ -38,7 +38,7 @@ $slider-height: map.merge(
       width: auto;
     }
 
-    &.disabled {
+    &.is-disabled {
       cursor: default;
 
       .#{$namespace}-slider__bar {

package/theme-chalk/src/steps.scss

@@ -7,7 +7,7 @@
   @include m(simple) {
     padding: 13px 8%;
     border-radius: 4px;
-    background: var(--el-bg-color);
+    background: getCssVar('fill-color', 'light');
   }
 
   @include m(horizontal) {

package/theme-chalk/src/table.scss

@@ -122,7 +122,7 @@
 
     &.is-group {
       th.#{$namespace}-table__cell {
-        background: var(--el-bg-color);
+        background: getCssVar('fill-color', 'light');
       }
     }
   }
@@ -354,7 +354,7 @@
               bottom: -1px;
               overflow-x: hidden;
               overflow-y: hidden;
-              box-shadow: inset -10px 0 10px -10px rgb(0 0 0 / 15%);
+              box-shadow: none;
               touch-action: none;
               pointer-events: none;
             }
@@ -367,7 +367,7 @@
           &.is-last-column {
             &::before {
               right: -10px;
-              box-shadow: inset 10px 0 10px -10px rgb(0 0 0 / 15%);
+              box-shadow: none;
             }
           }
         }
@@ -404,9 +404,9 @@
   }
 
   @include when(scrolling-left) {
-    .#{$namespace}-table-fixed-column--left.is-last-column {
+    .#{$namespace}-table-fixed-column--right.is-first-column {
       &::before {
-        box-shadow: none;
+        box-shadow: var(--el-table-fixed-right-column);
       }
     }
     &.#{$namespace}-table--border {
@@ -421,9 +421,9 @@
   }
 
   @include when(scrolling-right) {
-    .#{$namespace}-table-fixed-column--right.is-first-column {
+    .#{$namespace}-table-fixed-column--left.is-last-column {
       &::before {
-        box-shadow: none;
+        box-shadow: var(--el-table-fixed-left-column);
       }
     }
     .#{$namespace}-table-fixed-column--left.is-last-column.#{$namespace}-table__cell {
@@ -435,6 +435,16 @@
     .#{$namespace}-table-fixed-column--left.is-last-column.#{$namespace}-table__cell {
       border-right: none;
     }
+    .#{$namespace}-table-fixed-column--right.is-first-column {
+      &::before {
+        box-shadow: var(--el-table-fixed-right-column);
+      }
+    }
+    .#{$namespace}-table-fixed-column--left.is-last-column {
+      &::before {
+        box-shadow: var(--el-table-fixed-left-column);
+      }
+    }
   }
 
   @include when(scrolling-none) {

package/theme-chalk/src/tabs.scss

@@ -224,14 +224,14 @@
   }
   @include m(border-card) {
     background: $color-white;
-    border: 1px solid var(--el-border-color-base);
+    border: 1px solid getCssVar('border-color');
     box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12), 0 0 6px 0 rgba(0, 0, 0, 0.04);
 
     > .#{$namespace}-tabs__content {
       padding: 15px;
     }
     > .#{$namespace}-tabs__header {
-      background-color: var(--el-bg-color);
+      background-color: getCssVar('fill-color', 'light');
       border-bottom: 1px solid var(--el-border-color-light);
       margin: 0;
     }
@@ -256,8 +256,8 @@
       &.is-active {
         color: var(--el-color-primary);
         background-color: $color-white;
-        border-right-color: var(--el-border-color-base);
-        border-left-color: var(--el-border-color-base);
+        border-right-color: getCssVar('border-color');
+        border-left-color: getCssVar('border-color');
       }
       &:not(.is-disabled):hover {
         color: var(--el-color-primary);
@@ -305,7 +305,7 @@
     &.#{$namespace}-tabs--border-card {
       .#{$namespace}-tabs__header.is-bottom {
         border-bottom: 0;
-        border-top: 1px solid var(--el-border-color-base);
+        border-top: 1px solid getCssVar('border-color');
       }
       .#{$namespace}-tabs__nav-wrap.is-bottom {
         margin-top: -1px;

package/theme-chalk/src/tag.scss

@@ -1,7 +1,6 @@
 @use 'sass:map';
 
 @use 'mixins/mixins' as *;
-@use 'mixins/function' as *;
 @use 'mixins/var' as *;
 @use 'common/var' as *;
 
@@ -97,7 +96,7 @@ $tag-icon-span-gap: map.merge(
   align-items: center;
 
   height: map.get($tag-height, 'default');
-  padding: 0 map.get($tag-padding, 'default') - $border-width-base;
+  padding: 0 map.get($tag-padding, 'default') - $border-width;
   font-size: var(--el-tag-font-size);
   line-height: 1;
   border-width: $tag-border-width;
@@ -131,7 +130,7 @@ $tag-icon-span-gap: map.merge(
   }
 
   &.is-closable {
-    padding-right: map.get($tag-icon-span-gap, 'default') - $border-width-base;
+    padding-right: map.get($tag-icon-span-gap, 'default') - $border-width;
   }
 
   @each $size in (large, default, small) {
@@ -146,7 +145,7 @@ $tag-icon-span-gap: map.merge(
       }
 
       &.is-closable {
-        padding-right: map.get($tag-icon-span-gap, $size) - $border-width-base;
+        padding-right: map.get($tag-icon-span-gap, $size) - $border-width;
       }
     }
   }

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

@@ -1,4 +1,5 @@
 @use 'mixins/config' as *;
+@use 'mixins/mixins' as *;
 @use 'common/var' as *;
 @use './date-picker/picker.scss';
 @use './date-picker/date-picker.scss';
@@ -23,7 +24,7 @@
     }
 
     &:hover {
-      background-color: var(--el-bg-color);
+      background-color: getCssVar('fill-color', 'light');
       font-weight: bold;
       cursor: pointer;
     }