@element-plus/nightly 0.0.20221211 → 0.0.20221213

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

@@ -627,12 +627,12 @@ $cascader: map.merge(
 $statistic: () !default;
 $statistic: map.merge(
   (
-    'head-justify-content': center,
-    'content-justify-content': center,
-    'padding': 0 5px,
-    'content-margin-top': 4px,
-    'content-text-color': getCssVar('text-color', 'primary'),
-    'head-text-color': getCssVar('text-color', 'regular'),
+    'title-font-weight': 400,
+    'title-font-size': getCssVar('font-size', 'extra-small'),
+    'title-color': getCssVar('text-color', 'regular'),
+    'content-font-weight': 400,
+    'content-font-size': getCssVar('font-size', 'extra-large'),
+    'content-color': getCssVar('text-color', 'primary'),
   ),
   $statistic
 );

package/theme-chalk/src/menu.scss

@@ -70,13 +70,6 @@
             #{getCssVar('menu-level-padding')}
         );
       }
-      & .#{$namespace}-sub-menu__title {
-        padding-right: calc(
-          #{getCssVar('menu-base-level-padding')} + #{getCssVar(
-              'menu-icon-width'
-            )}
-        );
-      }
     }
   }
 
@@ -134,13 +127,6 @@
           background-color: getCssVar('bg-color', 'overlay');
         }
       }
-
-      & .#{$namespace}-sub-menu__icon-arrow {
-        position: static;
-        vertical-align: middle;
-        margin-left: 8px;
-        margin-top: -3px;
-      }
     }
     & .#{$namespace}-menu {
       & .#{$namespace}-menu-item,
@@ -180,7 +166,8 @@
     );
 
     > .#{$namespace}-menu-item,
-    > .#{$namespace}-sub-menu > .#{$namespace}-sub-menu__title {
+    > .#{$namespace}-sub-menu > .#{$namespace}-sub-menu__title,
+    > .#{$namespace}-menu-item-group > ul > .#{$namespace}-sub-menu > .#{$namespace}-sub-menu__title {
       [class^='#{$namespace}-icon'] {
         margin: 0;
         vertical-align: middle;
@@ -208,25 +195,6 @@
     .#{$namespace}-menu .#{$namespace}-sub-menu {
       min-width: 200px;
     }
-
-    .#{$namespace}-sub-menu {
-      position: relative;
-
-      & .#{$namespace}-menu {
-        position: absolute;
-        margin-left: 5px;
-        top: 0;
-        left: 100%;
-        z-index: 10;
-        border: 1px solid getCssVar('border-color-light');
-        border-radius: getCssVar('border-radius-small');
-        box-shadow: getCssVar('box-shadow-light');
-      }
-
-      &.is-active .#{$namespace}-sub-menu__title {
-        color: getCssVar('menu-active-color');
-      }
-    }
   }
   @include m(popup) {
     z-index: 100;
@@ -278,6 +246,9 @@
 
   @include e(title) {
     @include menu-item;
+    padding-right: calc(
+      #{getCssVar('menu-base-level-padding')} + #{getCssVar('menu-icon-width')}
+    );
 
     &:hover {
       background-color: getCssVar('menu-hover-bg-color');
@@ -323,7 +294,7 @@
     position: absolute;
     top: 50%;
     right: getCssVar('menu-base-level-padding');
-    margin-top: -7px;
+    margin-top: -6px;
     transition: transform getCssVar('transition-duration');
     font-size: 12px;
     margin-right: 0;

package/theme-chalk/src/statistic.scss

@@ -4,43 +4,32 @@
 
 @include b(statistic) {
   @include set-component-css-var('statistic', $statistic);
-  width: 100%;
-  box-sizing: border-box;
-  margin: 0;
-  padding: 0;
-  font-variant: tabular-nums;
-  // line-height: 1.5715;
-  list-style: none;
-  font-feature-settings: 'tnum';
-  @include e(head) {
-    padding: getCssVar('statistic-padding');
-    font-style: normal;
-    font-weight: 400;
-    font-size: getCssVar('font-size', 'extra-small');
 
-    width: 100%;
-    display: inline-flex;
-    align-items: center;
-    justify-content: getCssVar('statistic-head-justify-content');
-    color: getCssVar('statistic-head-text-color');
+  @include e(head) {
+    font-weight: getCssVar('statistic-title-font-weight');
+    font-size: getCssVar('statistic-title-font-size');
+    color: getCssVar('statistic-title-color');
+    line-height: 20px;
+    margin-bottom: 4px;
   }
+
   @include e(content) {
-    display: flex;
-    justify-content: getCssVar('statistic-content-justify-content');
-    align-items: center;
-    padding-top: getCssVar('statistic-content-margin-top');
-    @include e(number) {
-      font-style: normal;
-      padding: getCssVar('statistic-padding');
-      font-family: sans-serif;
+    font-weight: getCssVar('statistic-content-font-weight');
+    font-size: getCssVar('statistic-content-font-size');
+    color: getCssVar('statistic-content-color');
+
+    @include e(value) {
+      display: inline-block;
     }
-    span {
-      font-weight: 400;
-      color: getCssVar('statistic-content-text-color');
-      font-size: getCssVar('font-size', 'extra-large');
+
+    @include e(prefix) {
+      margin-right: 4px;
+      display: inline-block;
+    }
+
+    @include e(suffix) {
+      margin-left: 4px;
       display: inline-block;
-      margin: 0;
-      line-height: 28px;
     }
   }
 }