iov-design 2.15.55 → 2.15.56

package/packages/theme-chalk/src/iovfont.scss

@@ -1,8 +1,8 @@
 @font-face {
   font-family: 'iovfont';  /* Project id 4466910 */
-  src: url('//at.alicdn.com/t/c/font_4466910_8y5kjsv7pqg.woff2?t=1750820266142') format('woff2'),
-       url('//at.alicdn.com/t/c/font_4466910_8y5kjsv7pqg.woff?t=1750820266142') format('woff'),
-       url('//at.alicdn.com/t/c/font_4466910_8y5kjsv7pqg.ttf?t=1750820266142') format('truetype');
+  src: url('//at.alicdn.com/t/c/font_4466910_qnw5e0xxy7.woff2?t=1753354243540') format('woff2'),
+       url('//at.alicdn.com/t/c/font_4466910_qnw5e0xxy7.woff?t=1753354243540') format('woff'),
+       url('//at.alicdn.com/t/c/font_4466910_qnw5e0xxy7.ttf?t=1753354243540') format('truetype');
 }
 
 [class^="iov-icon-"], [class*=" iov-icon-"] {
@@ -36,6 +36,39 @@
   }
 }
 
+.iov-icon-bottle:before {
+  content: "\e6fe";
+}
+
+.iov-icon-line-github:before {
+  content: "\e6f8";
+}
+
+
+.iov-icon-sun:before {
+  content: "\e6f9";
+}
+
+.iov-icon-panel:before {
+  content: "\e6fa";
+}
+
+.iov-icon-cube:before {
+  content: "\e6fb";
+}
+
+.iov-icon-github:before {
+  content: "\e6fc";
+}
+
+.iov-icon-menu-fold-right:before {
+  content: "\e6fd";
+}
+
+.iov-icon-cdkey:before {
+  content: "\e6f7";
+}
+
 .iov-icon-circle-minus:before {
   content: "\e6f6";
 }
@@ -632,7 +665,7 @@
   content: "\e66a";
 }
 
-.iov-icon-menu-fold:before {
+.iov-icon-menu-fold-left:before {
   content: "\e66b";
 }
 

package/packages/theme-chalk/src/switch.scss

@@ -5,41 +5,167 @@
   display: inline-flex;
   align-items: center;
   position: relative;
-  font-size: $--switch-font-size;
-  line-height: $--switch-height;
-  height: $--switch-height;
+  line-height: 18px;
+  height: 18px;
   vertical-align: middle;
+  @include m(rect) {
+    .el-switch__core {
+      border-radius: 2px;
+      &:after {
+        border-radius: 1px;
+      }
+    }
+  }
+  @include m(medium) {
+    height: 16px;
+    line-height: 16px;
+    &.el-switch--rect {
+      .el-switch__core:after {
+        width: 12px;
+        height: 12px;
+        top: 2px;
+        left: 2px;
+      }
+    }
+    .el-switch__core {
+      width: 28px;
+      height: 16px;
+      &:after {
+        top: 1px;
+        left: 1px;
+      }
+    }
+    .el-switch__label {
+      i {
+        font-size: 8px;
+      }
+    }
+    .el-switch__label--left-icon {
+      margin-right: -12px;
+    }
+    .el-switch__label--right-icon {
+      margin-left: -12px;
+    }
+    .el-switch__label--left-text {
+      margin-right: -12px;
+    }
+    .el-switch__label--right-text {
+      margin-left: -12px;
+    }
+  }
+  @include m(small) {
+    height: 14px;
+    line-height: 14px;
+    &.el-switch--rect {
+      .el-switch__core:after {
+        width: 10px;
+        height: 10px;
+        top: 2px;
+        left: 2px;
+      }
+    }
+    .el-switch__core {
+      width: 24px;
+      height: 14px;
+      &:after {
+        width: 12px;
+        height: 12px;
+        top: 1px;
+        left: 1px;
+      }
+    }
+    .el-switch__label {
+      i {
+        font-size: 6px;
+      }
+      span {
+        font-size: 8px;
+      }
+    }
+    .el-switch__label--left-icon {
+      margin-right: -10px;
+    }
+    .el-switch__label--right-icon {
+      margin-left: -10px;
+    }
+    .el-switch__label--left-text {
+      margin-right: -11px;
+    }
+    .el-switch__label--right-text {
+      margin-left: -11px;
+    }
+  }
+  @include m(mini) {
+    height: 10px;
+    line-height: 10px;
+    .el-switch__core {
+      width: 18px;
+      height: 10px;
+      &:after {
+        width: 8px;
+        height: 8px;
+        top: 1px;
+        left: 1px;
+      }
+    }
+    .el-switch__label {
+      i {
+        font-size: 6px;
+      }
+      span {
+        font-size: 6px;
+      }
+    }
+    .el-switch__label--left-icon {
+      margin-right: -8px;
+    }
+    .el-switch__label--right-icon {
+      margin-left: -8px;
+    }
+    .el-switch__label--left-text {
+      margin-right: -8px;
+    }
+    .el-switch__label--right-text {
+      margin-left: -8px;
+    }
+  }
   @include when(disabled) {
-    & .el-switch__core,
-    & .el-switch__label {
+    .el-switch__core,
+    .el-switch__label {
       cursor: not-allowed;
     }
   }
 
   @include e(label) {
     transition: .2s;
-    height: $--switch-height;
-    display: inline-block;
-    font-size: $--switch-font-size;
-    font-weight: 500;
+    // height: 18px;
+    // display: inline-block;
+    // font-size: 13px;
+    // font-weight: 500;
+    // vertical-align: middle;
+    display: flex;
+    align-items: center;
     cursor: pointer;
-    vertical-align: middle;
-    color: $--color-text-primary;
-
-    @include when(active) {
-      color: $--color-primary;
+    z-index: 1;
+    color: #fff;
+    i {
+      font-size: 10px;
     }
-
-    @include m(left) {
-      margin-right: 10px;
+    span {
+      font-size: 9px;
+      font-weight: 500;
+    }
+    @include m(left-icon) {
+      margin-right: -14px;
+    }
+    @include m(right-icon) {
+      margin-left: -14px;
     }
-    @include m(right) {
-      margin-left: 10px;
+    @include m(left-text) {
+      margin-right: -14px;
     }
-    & * {
-      line-height: 1;
-      font-size: $--switch-font-size;
-      display: inline-block;
+    @include m(right-text) {
+      margin-left: -14px;
     }
   }
 
@@ -55,43 +181,88 @@
     margin: 0;
     display: inline-block;
     position: relative;
-    width: $--switch-width;
-    height: $--switch-height;
-    border: 1px solid $--switch-off-color;
+    width: 32px;
+    height: 18px;
     outline: none;
-    border-radius: $--switch-core-border-radius;
+    border-radius: 10px;
     box-sizing: border-box;
-    background: $--switch-off-color;
+    background: $--color-fill-4;
     cursor: pointer;
     transition: border-color .3s, background-color .3s;
     vertical-align: middle;
 
+    &:hover {
+      background: $--color-fill-5;
+    }
+
     &:after {
-      content: "";
+      content: '';
       position: absolute;
-      top: 1px;
-      left: 1px;
-      border-radius: $--border-radius-circle;
+      top: 2px;
+      left: 2px;
+      border-radius: 100%;
       transition: all .3s;
-      width: $--switch-button-size;
-      height: $--switch-button-size;
-      background-color: $--color-white;
+      width: 14px;
+      height: 14px;
+      background: #fff;
     }
   }
 
   @include when(checked) {
+    &:hover {
+      .el-switch__core {
+        background: $--color-primary-5;
+      }
+    }
     .el-switch__core {
-      border-color: $--switch-on-color;
-      background-color: $--switch-on-color;
+      background: $--color-primary-6;
       &::after {
         left: 100%;
-        margin-left: -$--switch-button-size - 1px;
+        margin-left: -16px;
+      }
+    }
+    &.el-switch--medium {
+      &.el-switch--rect {
+        .el-switch__core:after {
+          margin-left: -14px;
+        }
+      }
+      .el-switch__core {
+        &:after {
+          margin-left: -15px;
+        }
+      }
+    }
+    &.el-switch--small {
+      &.el-switch--rect {
+        .el-switch__core:after {
+          margin-left: -12px;
+        }
+      }
+      .el-switch__core {
+        &:after {
+          margin-left: -13px;
+        }
+      }
+    }
+    &.el-switch--mini {
+      .el-switch__core {
+        &:after {
+          margin-left: -9px;
+        }
       }
     }
   }
 
   @include when(disabled) {
-    opacity: 0.6;
+    .el-switch__core {
+      background: $--color-fill-3;
+    }
+    &.is-checked {
+      .el-switch__core {
+        background: $--color-primary-3;
+      }
+    }
   }
 
   @include m(wide) {

package/packages/theme-chalk/src/table.scss

@@ -40,7 +40,7 @@
   // 跨页选择
   @include e(cross-page-selection) {
     .iov-icon-arrow-down {
-      color: $--color-fill-6;
+      color: $--color-fill-4;
       cursor: pointer;
       transition: all ease .2s;
       &.show-selection-dropdown {

package/packages/theme-chalk/src/tabs.scss

@@ -176,26 +176,69 @@
     }
   }
   @include m(card) {
+    &.el-tabs--card-primary {
+      .el-tabs__item {
+        &.is-active {
+          position: relative;
+          color: $--color-primary-6;
+          border-top-color: transparent;
+          &:before {
+            content: '';
+            background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAABIBAMAAAANAGjIAAAAKlBMVEUAAAA/Vv8/V/8/V/8/V/8/V/8/V/9BWf89Vf9AVf8qVf8/Vv8+Wf8/V//3fmOTAAAADXRSTlMAkm3589XUKyoMBr1CxUdJxQAAAD9JREFUKM9jYGAoDLkLBAwMC4EkiMG1F8pgvAtl1N5N6mQAAVkjBggIPgBlODFAQQKMoQBjNMAYExhGwSjADwC0VhuDywNOfgAAAABJRU5ErkJggg==), url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAABIBAMAAAANAGjIAAAALVBMVEUAAAA/V/8/V/8/V/9AVv8+V/9AV/8+WP9BWf89Vf9AVf8qVf8/Vv8+Wf8/V/9Mw9oEAAAADnRSTlMA89XUlI9waysqDAa9QkOQHV4AAAA/SURBVCjPY3gHBEIRDAxABgh4wxhvNkAZ7xwYQGBl8rsXDBBQ+BTK4BVigAnBGMwwBhuMwQljcDGMglGAAwAASmoc2AEfAyMAAAAASUVORK5CYII=);
+            background-repeat: no-repeat, no-repeat;
+            background-position: 0, 100%;
+            background-size: 8px 100%, 8px 100%;
+            position: absolute;
+            top: 0;
+            left: -1px;
+            right: -1px;
+            height: 36px;
+          }
+          &:after {
+            content: '';
+            background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAABIAQMAAADF4Oe4AAAABlBMVEUAAAA/V/9SqD98AAAAAXRSTlMAQObYZgAAAA9JREFUCNdj+P8fgYYRAACKogf5+x8cIAAAAABJRU5ErkJggg==);
+            background-repeat: repeat-x;
+            background-position: 0 0;
+            background-size: 8px 36px;
+            left: 6px;
+            right: 6px;
+            position: absolute;
+            top: 0;
+            height: 36px;
+          }
+        }
+      }
+    }
     .el-tabs__item {
       height: 36px;
       line-height: 36px;
+      font-size: 14px;
+      font-weight: 400;
+      color: $--color-text-3;
+      transition: all ease .25s;
+      &:hover {
+        background: $--color-line-1;
+      }
     }
     &.el-tabs--medium {
       .el-tabs__item {
         height: 32px;
         line-height: 32px;
+        font-size: 14px;
       }
     }
     &.el-tabs--small {
       .el-tabs__item {
         height: 30px;
         line-height: 30px;
+        font-size: 13px;
       }
     }
     &.el-tabs--mini {
       .el-tabs__item {
         height: 28px;
         line-height: 28px;
+        font-size: 13px;
       }
     }
     .el-tabs__header {
@@ -233,8 +276,10 @@
         }
       }
       &.is-active {
-        border-bottom-color: $--color-white;
-        background: $--color-white;
+        border-bottom-color: #fff;
+        background: #fff;
+        font-weight: 500;
+        color: $--color-text-7;
 
         &.is-closable {
           padding-left: 20px;
@@ -257,18 +302,32 @@
       padding: 0 14px;
       color: $--color-text-3;
       transition: all ease .2s;
+      border: 0.5px solid transparent;
       &:hover {
         background: $--color-white;
+        border: 0.5px solid $--color-line-2;
+      }
+      &.is-disabled {
+        &:hover {
+          background: none;
+          border-color: transparent;
+        }
       }
     }
     &.el-tabs--medium {
+      .el-tabs__header {
+        height: 32px;
+      }
       .el-tabs__item {
-        height: 30px;
-        line-height: 30px;
+        height: 28px;
+        line-height: 28px;
         font-size: 13px;
       }
     }
     &.el-tabs--small {
+      .el-tabs__header {
+        height: 30px;
+      }
       .el-tabs__item {
         height: 26px;
         line-height: 26px;
@@ -276,6 +335,9 @@
       }
     }
     &.el-tabs--mini {
+      .el-tabs__header {
+        height: 28px;
+      }
       .el-tabs__item {
         height: 24px;
         line-height: 24px;
@@ -284,6 +346,7 @@
     }
     .el-tabs__header {
       padding: 2px;
+      height: 34px;
       display: inline-block;
       background: $--color-fill-2;
       border-radius: 4px;
@@ -318,6 +381,7 @@
       &.is-active {
         background: $--color-white;
         color: $--color-primary-6;
+        border: 0.5px solid $--color-line-2;
 
         &.is-closable {
           padding-left: 20px;

package/packages/theme-chalk/src/tag.scss

@@ -218,7 +218,7 @@
     color: $--color-text-6;
     font-size: 14px;
     height: auto;
-    line-height: 1;
+    line-height: normal;
     .el-tag__text {
       display: flex;
       align-items: center;

package/src/index.js

@@ -212,7 +212,7 @@ if (typeof window !== 'undefined' && window.Vue) {
 }
 
 export default {
-  version: '2.15.55',
+  version: '2.15.56',
   locale: locale.use,
   i18n: locale.i18n,
   install,