element-plus-secondary 0.3.3 → 0.3.5

package/theme-chalk/src/color-picker.scss

@@ -321,6 +321,11 @@ $color-picker-size: map.merge($common-component-size, $color-picker-size);
     font-size: 0;
     position: relative;
     cursor: pointer;
+
+    &:hover {
+      border-color: getCssVar('color-primary');
+    }
+    
   }
 
   @include e(color) {
@@ -405,6 +410,14 @@ $color-picker-size: map.merge($common-component-size, $color-picker-size);
 
       
     }
+
+    @include when(disabled) {
+      .#{$namespace}-color-picker__trigger {
+        &:hover {
+          border-color: getCssVar('border-color');
+        }
+      }
+    }
   }
 }
 

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

@@ -420,7 +420,7 @@ $select-option: map.merge(
   (
     'text-color': getCssVar('text-color-regular'),
     'disabled-color': getCssVar('text-color-placeholder'),
-    'height': 34px,
+    'height': 32px,
     'hover-background': getCssVar('fill-color', 'light'),
     'selected-text-color': getCssVar('color-primary'),
   ),

package/theme-chalk/src/menu.scss

@@ -189,7 +189,6 @@ $checked-icon: "data:image/svg+xml;utf8,%3Csvg class='icon' width='200' height='
 
     & .#{$namespace}-menu-item:not(.is-disabled):hover{
       outline: none;
-      color: getCssVar('menu-hover-text-color');
       background-color: rgba(31, 35, 41, 0.10);
       
     }

package/theme-chalk/src/option.scss

@@ -3,11 +3,31 @@
 @use 'mixins/mixins' as *;
 @use 'common/var' as *;
 
+$checked-icon: "data:image/svg+xml;utf8,%3Csvg class='icon' width='200' height='200' viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='currentColor' d='M406.656 706.944L195.84 496.256a32 32 0 10-45.248 45.248l256 256 512-512a32 32 0 00-45.248-45.248L406.592 706.944z'%3E%3C/path%3E%3C/svg%3E";
+
+@mixin checked-icon {
+  content: '';
+  position: absolute;
+  top: 50%;
+  right: 11px;
+  border-top: none;
+  border-right: none;
+  background-repeat: no-repeat;
+  background-position: center;
+  background-color: map.get($select-option, 'selected-text-color');
+  mask: url('#{$checked-icon}') no-repeat;
+  mask-size: 100% 100%;
+  -webkit-mask: url('#{$checked-icon}') no-repeat;
+  -webkit-mask-size: 100% 100%;
+  transform: translateY(-50%);
+  width: 16px;
+  height: 16px;
+}
 @include b(select-dropdown) {
   @include e(item) {
     font-size: map.get($select, 'font-size');
     // 20 as the padding of option item, 12 as the size of ✓ icon size
-    padding: 0 #{20 + 12}px 0 20px;
+    padding: 0 11px 0 11px;
     position: relative;
     white-space: nowrap;
     overflow: hidden;
@@ -31,6 +51,10 @@
     &.selected {
       color: map.get($select-option, 'selected-text-color');
       font-weight: bold;
+
+      &::after {
+        @include checked-icon;
+      }
     }
   }
 

package/theme-chalk/src/radio.scss

@@ -15,6 +15,15 @@ $radio-font-size: map.merge(
   $radio-font-size
 );
 
+$radio-font-size-de: () !default;
+$radio-font-size-de: map.merge(
+  (
+    'large': 14px,
+    'small': 14px,
+  ),
+  $radio-font-size-de
+);
+
 @include b(radio) {
   @include set-component-css-var('radio', $radio);
 }
@@ -233,8 +242,8 @@ $radio-font-size: map.merge(
         font-size: map.get($radio-font-size, $size);
       }
       @include e(inner) {
-        width: map.get($radio-font-size, $size);
-        height: map.get($radio-font-size, $size);
+        width: map.get($radio-font-size-de, $size);
+        height: map.get($radio-font-size-de, $size);
       }
     }
   }

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

@@ -20,8 +20,8 @@ $checked-icon: "data:image/svg+xml;utf8,%3Csvg class='icon' width='200' height='
   -webkit-mask: url('#{$checked-icon}') no-repeat;
   -webkit-mask-size: 100% 100%;
   transform: translateY(-50%);
-  width: 12px;
-  height: 12px;
+  width: 16px;
+  height: 16px;
 }
 
 @include b(select-dropdown) {
@@ -50,7 +50,7 @@ $checked-icon: "data:image/svg+xml;utf8,%3Csvg class='icon' width='200' height='
     }
   }
 
-  & .#{$namespace}-select-dropdown__option-item.is-selected:not(.radio) {
+  & .#{$namespace}-select-dropdown__option-item.is-selected:not(.radio){
     &::after {
       @include checked-icon;
     }