element-plus 2.0.4 → 2.0.5

package/theme-chalk/src/cascader-panel.scss

@@ -33,7 +33,7 @@
 
   @include e(wrap) {
     // Raise the priority
-    &.el-scrollbar__wrap {
+    &.#{$namespace}-scrollbar__wrap {
       height: 204px;
     }
   }

package/theme-chalk/src/cascader.scss

@@ -196,7 +196,7 @@
     flex: 1;
     height: 24px;
     min-width: 60px;
-    margin: 2px 0 2px 15px;
+    margin: 2px 0 2px map.get($input-padding-horizontal, 'default')-$border-width-base;
     padding: 0;
     color: var(--el-cascader-menu-text-color);
     border: none;

package/theme-chalk/src/common/transition.scss

@@ -87,8 +87,8 @@
     var(--el-transition-duration) padding-bottom ease-in-out;
 }
 
-.el-collapse-transition-leave-active,
-.el-collapse-transition-enter-active {
+.#{$namespace}-collapse-transition-leave-active,
+.#{$namespace}-collapse-transition-enter-active {
   transition: var(--el-transition-duration) max-height ease-in-out,
     var(--el-transition-duration) padding-top ease-in-out,
     var(--el-transition-duration) padding-bottom ease-in-out;

package/theme-chalk/src/common/var.scss

@@ -661,6 +661,7 @@ $dialog: map.merge(
     'content-font-size': 14px,
     'font-line-height': var(--el-font-line-height-primary),
     'padding-primary': 20px,
+    'border-radius': var(--el-border-radius-small),
   ),
   $dialog
 );

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

@@ -8,25 +8,25 @@
   @include when(week-mode) {
     .#{$namespace}-date-table__row {
       &:hover {
-        .el-date-table-cell {
+        .#{$namespace}-date-table-cell {
           background-color: var(--el-datepicker-inrange-bg-color);
         }
         td.available:hover {
           color: var(--el-datepicker-text-color);
         }
-        td:first-child .el-date-table-cell {
+        td:first-child .#{$namespace}-date-table-cell {
           margin-left: 5px;
           border-top-left-radius: 15px;
           border-bottom-left-radius: 15px;
         }
-        td:last-child .el-date-table-cell {
+        td:last-child .#{$namespace}-date-table-cell {
           margin-right: 5px;
           border-top-right-radius: 15px;
           border-bottom-right-radius: 15px;
         }
       }
 
-      &.current .el-date-table-cell {
+      &.current .#{$namespace}-date-table-cell {
         background-color: var(--el-datepicker-inrange-bg-color);
       }
     }

package/theme-chalk/src/dialog.scss

@@ -12,7 +12,7 @@
   position: relative;
   margin: var(--el-dialog-margin-top, 15vh) auto 50px;
   background: var(--el-dialog-bg-color);
-  border-radius: var(--el-border-radius-small);
+  border-radius: var(--el-dialog-border-radius);
   box-shadow: var(--el-dialog-box-shadow);
   box-sizing: border-box;
   width: var(--el-dialog-width, 50%);

package/theme-chalk/src/dropdown.scss

@@ -49,6 +49,11 @@ $dropdown-divider-width: 1px !default;
   line-height: 1;
   vertical-align: top;
 
+  &.is-disabled {
+    color: var(--el-text-color-placeholder);
+    cursor: not-allowed;
+  }
+
   @include e(popper) {
     @include set-component-css-var('dropdown', $dropdown);
 
@@ -160,6 +165,7 @@ $dropdown-menu-padding-vertical: map.merge(
   border: none;
   border-radius: var(--el-border-radius-base);
   box-shadow: none;
+  list-style: none;
 
   @include e(item) {
     display: flex;

package/theme-chalk/src/input.scss

@@ -188,6 +188,10 @@
       outline: none;
       @include inset-input-border(var(--el-input-focus-border-color));
     }
+    // override edge default style
+    &[type='password']::-ms-reveal {
+      display: none;
+    }
   }
 
   @include e(suffix) {
@@ -275,8 +279,10 @@
   }
 
   $input-padding-size-with-extra-icon: calc(
-    5px + map.get($input-font-size, 'default') +
-      map.get($input-padding-horizontal, 'default')
+    5px + #{map.get($input-font-size, 'default')} + #{map.get(
+        $input-padding-horizontal,
+        'default'
+      )}
   );
 
   @include m(suffix) {
@@ -313,8 +319,10 @@
       }
 
       $input-padding-size-with-extra-icon: calc(
-        5px + map.get($input-font-size, $size) +
-          map.get($input-padding-horizontal, $size)
+        5px + #{map.get($input-font-size, $size)} + #{map.get(
+            $input-padding-horizontal,
+            $size
+          )}
       );
 
       &.#{$namespace}-input--prefix {

package/theme-chalk/src/menu.scss

@@ -191,7 +191,6 @@
         border-radius: var(--el-border-radius-small);
         box-shadow: var(--el-box-shadow-light);
       }
-
       &.is-opened {
         > .#{$namespace}-sub-menu__title .#{$namespace}-sub-menu__icon-arrow {
           transform: none;
@@ -211,6 +210,10 @@
     border-radius: var(--el-border-radius-small);
     box-shadow: var(--el-box-shadow-light);
   }
+
+  .#{$namespace}-icon {
+    flex-shrink: 0;
+  }
 }
 
 @include b(menu-item) {
@@ -229,6 +232,17 @@
       color: inherit;
     }
   }
+  .#{$namespace}-menu-tooltip__trigger {
+    position: absolute;
+    left: 0;
+    top: 0;
+    height: 100%;
+    width: 100%;
+    display: inline-flex;
+    align-items: center;
+    box-sizing: border-box;
+    padding: 0 20px;
+  }
 }
 
 @include b(sub-menu) {

package/theme-chalk/src/message-box.scss

@@ -188,8 +188,8 @@
       margin-left: 0;
     }
 
-    @include e((btns, content)) {
-      text-align: center;
+    @include e(btns) {
+      justify-content: center;
     }
 
     @include e(content) {
@@ -197,6 +197,8 @@
 
       padding-left: $padding-horizontal;
       padding-right: $padding-horizontal;
+
+      text-align: center;
     }
   }
 }

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

@@ -47,12 +47,12 @@
   }
 
   @include when(multiple) {
-    .el-select-dropdown__option-item {
+    .#{$namespace}-select-dropdown__option-item {
       &.is-selected {
         color: map.get($select-option, 'selected-text-color');
         background-color: map.get($select-dropdown, 'bg-color');
 
-        & .el-icon {
+        & .#{$namespace}-icon {
           position: absolute;
           right: 20px;
           top: 0;

package/theme-chalk/src/page-header.scss

@@ -28,7 +28,7 @@
       display: flex;
       align-items: center;
 
-      .el-icon {
+      .#{$namespace}-icon {
         font-size: inherit;
       }
     }

package/theme-chalk/src/pagination.scss

@@ -10,7 +10,7 @@
     margin-left: 0;
   }
 
-  & + .el-pager {
+  & + .#{$namespace}-pager {
     .number {
       &:first-child {
         margin-left: 0;
@@ -144,7 +144,7 @@
       line-height: var(--el-pagination-line-height-extra-small);
       .#{$namespace}-input__suffix-inner {
         line-height: var(--el-pagination-line-height-extra-small);
-        i.el-select__caret {
+        i.#{$namespace}-select__caret {
           line-height: var(--el-pagination-line-height-extra-small);
         }
       }

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

@@ -70,6 +70,14 @@ $input-inline-start: map.get($input-padding-horizontal, 'default') !default;
         opacity: 1;
         user-select: none;
       }
+
+      #{$selector}__caret {
+        cursor: not-allowed;
+      }
+
+      #{$selector}__combobox-input {
+        cursor: not-allowed;
+      }
     }
 
     #{$selector}__input-wrapper {

package/theme-chalk/src/select.scss

@@ -148,10 +148,6 @@
     flex-wrap: wrap;
   }
 
-  .#{$namespace}-tag__close {
-    margin-top: -2px;
-  }
-
   .#{$namespace}-select__tags {
     .#{$namespace}-tag {
       box-sizing: border-box;

package/theme-chalk/src/table.scss

@@ -63,6 +63,7 @@
     .cell {
       padding: 0;
       text-align: center;
+      user-select: none;
     }
   }
 
@@ -396,7 +397,7 @@
 
   @include e((header-wrapper, body-wrapper)) {
     .#{$namespace}-table-column--selection {
-      .el-checkbox {
+      .#{$namespace}-checkbox {
         height: unset;
       }
     }

package/theme-chalk/src/tabs.scss

@@ -21,16 +21,19 @@
     list-style: none;
   }
   @include e(new-tab) {
+    display: flex;
+    align-items: center;
+    justify-content: center;
     float: right;
     border: 1px solid #d3dce6;
-    height: 18px;
-    width: 18px;
-    line-height: 18px;
-    margin: 10px;
+    height: 20px;
+    width: 20px;
+    line-height: 20px;
+    margin: 10px 0 10px 10px;
     border-radius: 3px;
     text-align: center;
     font-size: 12px;
-    color: #d3dce6;
+    color: var(--el-text-color-primary);
     cursor: pointer;
     transition: all 0.15s;