@element-plus/nightly 0.0.20220321 → 0.0.20220324

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

@@ -16,8 +16,7 @@
     vertical-align: top;
     position: relative;
 
-    &
-      .#{$namespace}-scrollbar__wrap:not(.#{$namespace}-scrollbar__wrap--hidden-default) {
+    &.#{$namespace}-scrollbar__wrap:not(.#{$namespace}-scrollbar__wrap--hidden-default) {
       padding-bottom: 15px;
     }
 
@@ -30,7 +29,7 @@
         transform: translateY(-32px);
       }
 
-      .#{$namespace}-time-spinner__item:hover:not(.disabled):not(.active) {
+      .#{$namespace}-time-spinner__item:hover:not(.is-disabled):not(.is-active) {
         background: $color-white;
         cursor: default;
       }
@@ -94,17 +93,17 @@
     font-size: 12px;
     color: var(--el-text-color-regular);
 
-    &:hover:not(.disabled):not(.active) {
+    &:hover:not(.is-disabled):not(.is-active) {
       background: getCssVar('fill-color', 'light');
       cursor: pointer;
     }
 
-    &.active:not(.disabled) {
+    &.is-active:not(.is-disabled) {
       color: var(--el-text-color-primary);
       font-weight: bold;
     }
 
-    &.disabled {
+    &.is-disabled {
       color: var(--el-text-color-placeholder);
       cursor: not-allowed;
     }

package/theme-chalk/src/empty.scss

@@ -25,7 +25,8 @@
     }
 
     svg {
-      fill: var(--el-svg-monochrome-grey);
+      color: getCssVar('svg-monochrome-grey');
+      fill: currentColor;
       width: 100%;
       height: 100%;
       vertical-align: top;

package/theme-chalk/src/input.scss

@@ -52,6 +52,7 @@
     color: var(--el-input-text-color, map.get($input, 'text-color'));
     background-color: var(--el-input-bg-color, map.get($input, 'bg-color'));
     background-image: none;
+    -webkit-appearance: none;
     @include inset-input-border(
       var(--el-input-border-color, map.get($input, 'border-color'))
     );

package/theme-chalk/src/mixins/_button.scss

@@ -4,7 +4,7 @@
 @use '../mixins/function' as *;
 @use '../common/var' as *;
 
-@mixin button-plain($color, $type) {
+@mixin button-plain($type) {
   $button-color-types: (
     '': (
       'text-color': (
@@ -41,10 +41,6 @@
         'color',
         'white',
       ),
-      'border-color': (
-        'color',
-        $type,
-      ),
     ),
   );
 
@@ -135,7 +131,7 @@
   }
 
   &.is-plain {
-    @include button-plain(var(--el-button-bg-color), $type);
+    @include button-plain($type);
   }
 }
 

package/theme-chalk/src/reset.scss

@@ -13,7 +13,7 @@ body {
 }
 
 a {
-  color: var(--el-color-primary);
+  color: getCssVar('color', 'primary');
   text-decoration: none;
 
   &:hover,
@@ -22,7 +22,7 @@ a {
   }
 
   &:active {
-    color: mix($color-black, $color-primary, $button-active-shade-percent);
+    color: getCssVar('color-primary', 'dark-2');
   }
 }
 
@@ -32,7 +32,7 @@ h3,
 h4,
 h5,
 h6 {
-  color: var(--el-text-color-regular);
+  color: getCssVar('text-color', 'regular');
   font-weight: inherit;
 
   &:first-child {

package/theme-chalk/src/skeleton-item.scss

@@ -74,7 +74,8 @@
     border-radius: 0;
 
     svg {
-      fill: var(--el-svg-monochrome-grey);
+      color: getCssVar('svg-monochrome-grey');
+      fill: currentColor;
       width: 22%;
       height: 22%;
     }

package/theme-chalk/src/tag.scss

@@ -97,6 +97,7 @@ $tag-icon-span-gap: map.merge(
 
   height: map.get($tag-height, 'default');
   padding: 0 map.get($tag-padding, 'default') - $border-width;
+
   font-size: var(--el-tag-font-size);
   line-height: 1;
   border-width: $tag-border-width;
@@ -133,7 +134,7 @@ $tag-icon-span-gap: map.merge(
     padding-right: map.get($tag-icon-span-gap, 'default') - $border-width;
   }
 
-  @each $size in (large, default, small) {
+  @each $size in (large, small) {
     @include m($size) {
       padding: 0 map.get($tag-padding, $size) - $tag-border-width;
       height: map.get($tag-height, $size);
@@ -157,7 +158,7 @@ $tag-icon-span-gap: map.merge(
   }
 
   @each $type in $types {
-    &.#{$namespace}-tag--#{$type} {
+    &.#{bem('tag', '', $type)} {
       @include when(hit) {
         border-color: getCssVar('color', $type);
       }