element-plus 2.2.11 → 2.2.14

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

@@ -496,10 +496,9 @@ $messagebox: map.merge(
 $message: () !default;
 $message: map.merge(
   (
-    'width': 380px,
     'bg-color': getCssVar('color', 'info', 'light-9'),
     'border-color': getCssVar('border-color-lighter'),
-    'padding': 15px 15px 15px 20px,
+    'padding': 15px 19px,
     'close-size': 16px,
     'close-icon-color': getCssVar('text-color-placeholder'),
     'close-hover-color': getCssVar('text-color-secondary'),

package/theme-chalk/src/input.scss

@@ -317,6 +317,7 @@
 
     .#{$namespace}-input__inner {
       color: map.get($input-disabled, 'text-color');
+      -webkit-text-fill-color: map.get($input-disabled, 'text-color');
       cursor: not-allowed;
 
       &::placeholder {

package/theme-chalk/src/menu.scss

@@ -64,6 +64,7 @@
       & .#{$namespace}-menu-item,
       & .#{$namespace}-sub-menu__title,
       & .#{$namespace}-menu-item-group__title {
+        white-space: nowrap;
         padding-left: calc(
           #{getCssVar('menu-base-level-padding')} + #{getCssVar('menu-level')} *
             #{getCssVar('menu-level-padding')}

package/theme-chalk/src/message.scss

@@ -9,7 +9,7 @@
 }
 
 @include b(message) {
-  width: getCssVar('message', 'width');
+  width: fit-content;
   max-width: calc(100% - 32px);
   box-sizing: border-box;
   border-radius: getCssVar('border-radius-base');
@@ -20,7 +20,6 @@
   left: 50%;
   top: 20px;
   transform: translateX(-50%);
-  transition: opacity 0.3s, transform 0.4s, top 0.4s;
   background-color: getCssVar('message', 'bg-color');
   transition: opacity getCssVar('transition-duration'), transform 0.4s, top 0.4s;
   padding: getCssVar('message', 'padding');
@@ -33,7 +32,7 @@
 
   @include when(closable) {
     .#{$namespace}-message__content {
-      padding-right: 16px;
+      padding-right: 31px;
     }
   }
 
@@ -55,6 +54,7 @@
 
       .#{$namespace}-message__content {
         color: getCssVar('message', 'text-color');
+        overflow-wrap: anywhere;
       }
     }
 
@@ -85,7 +85,7 @@
   & .#{$namespace}-message__closeBtn {
     position: absolute;
     top: 50%;
-    right: 15px;
+    right: 19px;
     transform: translateY(-50%);
     cursor: pointer;
     color: getCssVar('message', 'close-icon-color');

package/theme-chalk/src/popover.scss

@@ -18,6 +18,7 @@
     font-size: getCssVar('popover-font-size');
     box-shadow: getCssVar('box-shadow-light');
     word-break: break-all;
+    box-sizing: border-box;
 
     @include m(plain) {
       padding: getCssVar('popover-padding-large');

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

@@ -1,12 +1,10 @@
 @use '../mixins/mixins' as *;
+@use '../mixins/utils' as *;
 
 // same style in select & select-v2
 @mixin select-common($name) {
   .#{$namespace}-#{$name}__tags-text {
-    text-overflow: ellipsis;
-    display: inline-flex;
-    justify-content: center;
-    align-items: center;
-    overflow: hidden;
+    display: inline-block;
+    @include utils-ellipsis;
   }
 }

package/theme-chalk/src/table.scss

@@ -211,16 +211,8 @@
     user-select: none;
     background-color: getCssVar('table-header-bg-color');
 
-    > .cell {
-      display: inline-block;
-      box-sizing: border-box;
-      position: relative;
-      vertical-align: middle;
-      width: 100%;
-
-      &.highlight {
-        color: getCssVar('color-primary');
-      }
+    > .cell.highlight {
+      color: getCssVar('color-primary');
     }
 
     &.required > div::before {
@@ -412,6 +404,11 @@
 
   @include e((header-wrapper, body-wrapper)) {
     .#{$namespace}-table-column--selection {
+      > .cell {
+        display: inline-flex;
+        align-items: center;
+        height: 23px;
+      }
       .#{$namespace}-checkbox {
         height: unset;
       }