amis 1.6.5-beta.3 → 1.8.0-beta.0

package/scss/components/_tooltip.scss

@@ -169,6 +169,7 @@
     border-top-right-radius: calc(
       var(--Tooltip-borderRadius) - var(--Tooltip-borderWidth)
     );
+    font-weight: var(--Tooltip-title-fontWeight);
 
     &:empty {
       display: none;
@@ -179,6 +180,77 @@
     color: var(--Tooltip-body-color);
     padding: var(--Tooltip-body-paddingY) var(--Tooltip-body-paddingX);
   }
+
+  &--dark {
+    background: var(--Tooltip-bg--dark);
+    border: none;
+    box-shadow: var(--Tooltip-boxShadow--dark);
+
+    .#{$ns}Tooltip-title {
+      color: var(--Tooltip-title-color--dark);
+      background: transparent;
+      border-bottom: none;
+
+      &::before {
+        border-bottom-color: transparent;
+      }
+    }
+
+    .#{$ns}Tooltip-body {
+      color: var(--Tooltip-body-color--dark);
+    }
+
+    $placements: top left right bottom;
+    &.#{$ns}Tooltip--top {
+      .#{$ns}Tooltip-arrow {
+        &::before {
+          border-width: 0;
+        }
+        &::after {
+          border-top-color: var(--Tooltip-arrow-color--dark);
+        }
+      }
+    }
+
+    &.#{$ns}Tooltip--bottom {
+      .#{$ns}Tooltip-arrow {
+        &::before {
+          border-width: 0;
+        }
+        &::after {
+          border-bottom-color: var(--Tooltip-arrow-color--dark);
+        }
+      }
+    }
+
+    &.#{$ns}Tooltip--left {
+      .#{$ns}Tooltip-arrow {
+        &::before {
+          border-width: 0;
+        }
+        &::after {
+          border-left-color: var(--Tooltip-arrow-color--dark);
+        }
+      }
+    }
+
+    &.#{$ns}Tooltip--right {
+      .#{$ns}Tooltip-arrow {
+        &::before {
+          border-width: 0;
+        }
+        &::after {
+          border-right-color: var(--Tooltip-arrow-color--dark);
+        }
+      }
+    }
+  }
+}
+
+.#{$ns}TooltipWrapper {
+  &--inline {
+    display: inline-block;
+  }
 }
 
 @keyframes tooltipIn {

package/scss/components/form/_file.scss

@@ -16,12 +16,17 @@
 
   &-selectBtn {
     display: inline-flex;
-    align-items: center;
     margin-right: 10px;
 
     > svg {
-      width: px2rem(14px);
-      height: px2rem(14px);
+      margin-right: 4px !important;
+      width: px2rem(16px);
+      height: px2rem(16px);
+    }
+
+    > span {
+      font-size: var(--fontSizeSm);
+      line-height: 20px;
     }
   }
 
@@ -45,25 +50,41 @@
     font-size: 12px;
   }
 
+  &-sizeTip {
+    margin-top: 4px;
+    line-height: 20px;
+    font-size: var(--fontSizeSm);
+    color: var(--FileControl-icon-color);
+  }
+
   &-list {
     list-style: none;
-    margin: 10px 0;
+    margin: 8px 0;
     padding: 0;
+    max-height: 144px;
+    overflow-x: hidden;
+    overflow-y: auto;
 
     > li {
-      color: #333;
+      margin-bottom: 4px;
       font-size: 12px;
 
       &:hover {
-        color: #108cee;
-        background: #f3f3f3;
+        border-radius: 2px;
+        background: var(--FileControl-onHover-bg);
       }
     }
+
+    &-tooltip span {
+      font-size: var(--fontSizeSm);
+      color: var(--FileControl-danger-color);
+    }
   }
 
   &-itemInfo {
-    padding: 0px 6px;
-    line-height: 26px;
+    padding: 2px 4px;
+    display: flex;
+    line-height: 24px;
     height: auto;
 
     span {
@@ -71,11 +92,7 @@
     }
 
     &.is-invalid {
-      color: #999;
-    }
-
-    > svg:first-child {
-      margin-right: 10px;
+      color: var(--FileControl-danger-color);
     }
 
     > svg:not(:first-child) {
@@ -86,23 +103,26 @@
     }
   }
 
+  &-itemInfoIcon {
+    margin-right: 4px;
+  }
+
   &-itemInfoText {
     white-space: nowrap;
-    max-width: 170px;
     overflow: hidden;
     text-overflow: ellipsis;
-    display: inline-block;
+
     vertical-align: middle;
   }
 
   &-clear {
     float: right;
-    color: #999;
+    color: var(--FileControl-icon-color);
     display: none;
     cursor: pointer;
 
     &:hover {
-      color: #333;
+      color: var(--FileControl-icon-onHover-color);
     }
   }
 
@@ -154,14 +174,52 @@
     }
   }
 
+  &-dropzone.disabled > &-acceptTip {
+    filter: grayscale(100%);
+    box-shadow: none;
+    cursor: not-allowed;
+    color: var(--FileControl-onDisabled-color);
+    pointer-events: auto;
+    background: var(--FileControl-onDisabled-bg);
+
+    &:hover {
+      border-color: var(--FileControl-border-color);
+    }
+
+    > div,
+    > span {
+      color: var(--FileControl-onDisabled-color);
+    }
+  }
+
   &-acceptTip {
-    height: 120px;
-    color: #999;
-    border: 2px dashed var(--info);
-    border-radius: var(--borderRadius);
-    background: #f3f9fe;
-    line-height: 120px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-flow: column;
+    height: 180px;
     text-align: center;
+    border: 1px dashed var(--FileControl-border-color);
+    border-radius: var(--borderRadius);
+    background: var(--white);
+    cursor: pointer;
+
+    &:hover {
+      border-color: var(--info);
+    }
+
+    > span {
+      margin-top: 8px;
+      line-height: 20px;
+      font-size: var(--fontSizeSm);
+      color: var(--FileControl-drag-color);
+    }
+
+    > svg {
+      width: 48px;
+      height: 48px;
+      top: 0;
+    }
   }
 
   &-sum {

package/scss/components/form/_image.scss

@@ -82,6 +82,36 @@
     margin-bottom: var(--gap-base);
     position: relative;
     width: px2rem(120px);
+
+    &.is-invalid {
+      padding: 0;
+      border-color: var(--FileControl-danger-color);
+    }
+
+    svg.icon-refresh {
+      transform: rotate(180deg);
+    }
+  }
+
+  &-filename {
+    display: inline-flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    color: var(--FileControl-danger-color);
+
+    > svg.icon-image {
+      margin-bottom: 8px;
+      width: 24px;
+      height: 24px;
+    }
+
+    > span {
+      max-width: 100%;
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+    }
   }
 
   &-image {
@@ -148,31 +178,6 @@
     display: block;
   }
 
-  &-retryBtn {
-    margin: 0;
-    width: px2rem(110px);
-    height: px2rem(110px);
-    display: inline-flex;
-    cursor: pointer;
-    justify-content: center;
-    align-items: center;
-    align-content: center;
-    flex-wrap: wrap;
-    color: #666;
-
-    &:hover {
-      color: #333;
-      text-decoration: none;
-    }
-
-    > p {
-      width: 100%;
-      text-align: center;
-      color: var(--danger);
-      margin: 10px 0 0;
-    }
-  }
-
   &-errorMsg {
     color: var(--danger);
     margin: 5px 0 0;

package/scss/components/form/_number.scss

@@ -9,6 +9,7 @@
   background: var(--Number-bg);
   border: var(--Number-borderWidth) solid var(--Number-borderColor);
   border-radius: var(--Number-borderRadius);
+  overflow: hidden;
 
   @include input-border();
   &.no-steps > &-handler-wrap {
@@ -73,6 +74,7 @@
     transition: all var(--animation-duration) ease;
     border: 0;
     border-radius: var(--Form-input-borderRadius);
+    color: var(--Form-input-color);
     padding: 0 var(--Form-input-paddingX);
   }
 

package/scss/components/form/_switch.scss

@@ -19,7 +19,7 @@
   .text {
     margin: 0 px2rem(7px) 0 px2rem(25px);
     color: var(--Switch-valueColor);
-    text-indent: calc(var(--Switch-width) / 2);
+    text-indent: var(--gap-xs);
     text-transform: uppercase;
     font-size: var(--fontSizeSm);
     line-height: var(--Switch-height);
@@ -58,9 +58,7 @@
     }
 
     .text {
-      margin: 0 25px 0 7px;
       color: var(--white);
-      text-indent: var(--gap-xs); // todo
     }
   }
 

package/scss/themes/_cxd-colors.scss

@@ -1,56 +1,56 @@
-// yunshe4.0
-$B1: #e9f0fd;
-$B2: #d3e0fc;
+// yunshe4.1
+$B1: #e6f0ff;
+$B2: #d4e5ff;
 $B3: #a7c2f9;
-$B4: #7ba4f7;
-$B5: #4f86f4;
+$B4: #a8caff;
+$B5: #528eff;
 $B6: #2468f2;
-$B7: #1c53c1;
+$B7: #144bcc;
 $B8: #153e91;
 $B9: #0e2960;
 $B10: #091a3c;
 
-$E1: #fdf0ee;
-$E2: #fce0dc;
-$E3: #fac1ba;
-$E4: #f8a397;
-$E5: #f68475;
-$E6: #e8684a;
-$E7: #c35142;
-$E8: #923d31;
-$E9: #612821;
-$E10: #3d1914;
+$E1: #ffe8e6;
+$E2: #ffdbd9;
+$E3: #ffb6b3;
+$E4: #ff908c;
+$E5: #ff6966;
+$E6: #f33e3e;
+$E7: #cc292e;
+$E8: #a61922;
+$E9: #800d18;
+$E10: #590410;
 
-$S1: #e7f9f2;
-$S2: #cff2de;
-$S3: #a0e5bd;
-$S4: #71d99c;
-$S5: #42cc7b;
-$S6: #0bc286;
-$S7: #0f9948;
-$S8: #0b7336;
-$S9: #074c24;
-$S10: #004d25;
+$S1: #ecffe6;
+$S2: #d1f2c7;
+$S3: #a5e693;
+$S4: #7bd964;
+$S5: #54cc39;
+$S6: #30bf13;
+$S7: #1b9908;
+$S8: #0b7300;
+$S9: #054d00;
+$S10: #012600;
 
-$W1: #fff7e6;
-$W2: #ffefcc;
-$W3: #ffe099;
-$W4: #ffd066;
-$W5: #ffc133;
-$W6: #ffb200;
-$W7: #cc8e00;
-$W8: #996a00;
-$W9: #664700;
-$W10: #332300;
+$W1: #fff4e6;
+$W2: #ffecd4;
+$W3: #ffd8a8;
+$W4: #ffc27d;
+$W5: #ffab52;
+$W6: #ff9326;
+$W7: #d97116;
+$W8: #b35209;
+$W9: #8c3800;
+$W10: #662500;
 
-$G1: #080e1a;
-$G2: #151a26;
-$G3: #2d323c;
-$G4: #5e626a;
-$G5: #83868c;
-$G6: #b4b6ba;
-$G7: #cecfd1;
-$G8: #dadbdd;
-$G9: #e6e6e8;
-$G10: #f2f2f4;
-$G11: #ffffff;
+$G1: #070c14;
+$G2: #151b26;
+$G3: #303540;
+$G4: #5c5f66;
+$G5: #84868c;
+$G6: #b8babf;
+$G7: #d4d6d9;
+$G8: #e8e9eb;
+$G9: #f2f2f4;
+$G10: #f7f7f9;
+$G11: #ffffff;

package/scss/themes/_cxd-variables.scss

@@ -353,6 +353,14 @@ $L1: 0px 4px 6px 0px rgba(8, 14, 26, 0.06),
   --Button--link-color: var(--primary);
   --Button--link-onHover-color: #209bfd;
 
+  --Breadcrumb-item-default-color: #{$G5};
+  --Breadcrumb-item-hover-color: #{$B6};
+  --Breadcrumb-item-active-color: #{$B7};
+  --Breadcrumb-item-disabled-color: #{$G6};
+  --BreadcrumbDropdown-item-default-color: #{$G2};
+  --BreadcrumbDropdown-item-default-bg: #{$G11};
+  --BreadcrumbDropdown-item-hover-bg: #{$B1};
+
   --Spinner-bg: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIKImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB3aWR0aD0iMTkycHgiIGhlaWdodD0iMTkycHgiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMzQuNSA2MC41IEw5NiAyNC41IEwxNTguNSA2MC41IFYxMzIgTDk2LjUgMTY3LjUgTDM0LjUgMTMyIEwzNC41IDYwLjUgWiIgc3Ryb2tlPSIjMTA4Y2VlIgpzdHlsZT0ic3Ryb2tlLXdpZHRoOiAxNnB4OwogICAgICAgc3Ryb2tlLW9wYWNpdHk6IDE7CiAgICAgICBmaWxsLW9wYWNpdHk6IDA7CiAgICAgICBzdHJva2UtZGFzaGFycmF5OiA4MDAgODAwOwogICAgICAgc3Ryb2tlLWRhc2hvZmZzZXQ6IDgwMDsiPjxhbmltYXRlIGNhbGNNb2RlPSJzcGxpbmUiIGtleVRpbWVzPSIwOyAxIiBrZXlTcGxpbmVzPSIuNSAwIC41IDEiIGF0dHJpYnV0ZU5hbWU9InN0cm9rZS1kYXNoYXJyYXkiIGlkPSJsaW5lIiBmcm9tPSI4MDAgODAwIiB0bz0iODAwIDgwMCIgYmVnaW49ImZpcnN0LmVuZCIgZHVyPSIxLjJzIiBmaWxsID0gImZyZWV6ZSIvPjxhbmltYXRlIGNhbGNNb2RlPSJzcGxpbmUiIGtleVRpbWVzPSIwOyAxIiBrZXlTcGxpbmVzPSIuNSAwIC41IDEiIGF0dHJpYnV0ZU5hbWU9InN0cm9rZS1kYXNob2Zmc2V0IiBmcm9tPSI4MDAiIHRvPSItODAwIiBiZWdpbj0iZmlyc3QuZW5kIiBkdXI9IjEuMnMiIGZpbGwgPSAiZnJlZXplIi8+PC9wYXRoPjxjaXJjbGUgY3g9Ijk2LjUiIGN5PSI5Ni41IiByPSIxMCIgZmlsbD0iIzEwOGNlZSI+PGFuaW1hdGUgY2FsY01vZGU9InNwbGluZSIga2V5VGltZXM9IjA7IDEiIGtleVNwbGluZXM9Ii45IDAgLjMgMSIgYXR0cmlidXRlTmFtZT0iY3giIGlkPSJmaXJzdCIgdG89IjM0LjUiIGJlZ2luPSIwczsgc2Vjb25kLmVuZCArIDAuNyIgZHVyPSIwLjVzIiBmaWxsID0gImZyZWV6ZSIvPjxhbmltYXRlIGNhbGNNb2RlPSJzcGxpbmUiIGtleVRpbWVzPSIwOyAxIiBrZXlTcGxpbmVzPSIuOSAwIC4zIDEiIGF0dHJpYnV0ZU5hbWU9ImN5IiB0bz0iNjAuNSIgYmVnaW49IjBzOyBzZWNvbmQuZW5kICsgMC43IiBkdXI9IjAuNXMiIGZpbGwgPSAiZnJlZXplIi8+PGFuaW1hdGUgY2FsY01vZGU9InNwbGluZSIga2V5VGltZXM9IjA7IDEiIGtleVNwbGluZXM9Ii45IDAgLjMgMSIgYXR0cmlidXRlTmFtZT0iciIgIHRvPSIyMCIgYmVnaW49IjBzOyBzZWNvbmQuZW5kICsgMC43IiBkdXI9IjAuNXMiIGZpbGwgPSAiZnJlZXplIi8+PGFuaW1hdGUgY2FsY01vZGU9InNwbGluZSIga2V5VGltZXM9IjA7IDEiIGtleVNwbGluZXM9Ii45IDAgLjMgMSIgYXR0cmlidXRlTmFtZT0iY3giIGlkPSJzZWNvbmQiIGZyb209IjM0LjUiIHRvPSI5Ni41IiBiZWdpbj0iZmlyc3QuZW5kICsgMS4yIiBkdXI9IjAuNXMiIGZpbGwgPSAiZnJlZXplIi8+PGFuaW1hdGUgY2FsY01vZGU9InNwbGluZSIga2V5VGltZXM9IjA7IDEiIGtleVNwbGluZXM9Ii45IDAgLjMgMSIgYXR0cmlidXRlTmFtZT0iY3kiIGZyb209IjYwLjUiIHRvPSI5Ni41IiBiZWdpbj0iZmlyc3QuZW5kICsgMS4yIiBkdXI9IjAuNXMiIGZpbGwgPSAiZnJlZXplIi8+PGFuaW1hdGUgY2FsY01vZGU9InNwbGluZSIga2V5VGltZXM9IjA7IDEiIGtleVNwbGluZXM9Ii45IDAgLjMgMSIgYXR0cmlidXRlTmFtZT0iciIgIHRvPSIxMCIgYmVnaW49ImZpcnN0LmVuZCArIDEuMiIgZHVyPSIwLjVzIiBmaWxsID0gImZyZWV6ZSIvPjwvY2lyY2xlPjxjaXJjbGUgY3g9Ijk2LjUiIGN5PSI5Ni41IiByPSIxMCIgZmlsbD0iIzEwOGNlZSI+PGFuaW1hdGUgY2FsY01vZGU9InNwbGluZSIga2V5VGltZXM9IjA7IDEiIGtleVNwbGluZXM9Ii45IDAgLjMgMSIgYXR0cmlidXRlTmFtZT0iY3kiIHRvPSIyNC41IiBiZWdpbj0iMHM7IHNlY29uZC5lbmQgKyAwLjciIGR1cj0iMC41cyIgZmlsbCA9ICJmcmVlemUiLz48YW5pbWF0ZSBjYWxjTW9kZT0ic3BsaW5lIiBrZXlUaW1lcz0iMDsgMSIga2V5U3BsaW5lcz0iLjkgMCAuMyAxIiBhdHRyaWJ1dGVOYW1lPSJyIiAgdG89IjIwIiBiZWdpbj0iMHM7IHNlY29uZC5lbmQgKyAwLjciIGR1cj0iMC41cyIgZmlsbCA9ICJmcmVlemUiLz48YW5pbWF0ZSBjYWxjTW9kZT0ic3BsaW5lIiBrZXlUaW1lcz0iMDsgMSIga2V5U3BsaW5lcz0iLjkgMCAuMyAxIiBhdHRyaWJ1dGVOYW1lPSJjeSIgZnJvbT0iMjQuNSIgdG89Ijk2LjUiIGJlZ2luPSJmaXJzdC5lbmQgKyAxLjIiIGR1cj0iMC41cyIgZmlsbCA9ICJmcmVlemUiLz48YW5pbWF0ZSBjYWxjTW9kZT0ic3BsaW5lIiBrZXlUaW1lcz0iMDsgMSIga2V5U3BsaW5lcz0iLjkgMCAuMyAxIiBhdHRyaWJ1dGVOYW1lPSJyIiAgdG89IjEwIiBiZWdpbj0iZmlyc3QuZW5kICsgMS4yIiBkdXI9IjAuNXMiIGZpbGwgPSAiZnJlZXplIi8+PC9jaXJjbGU+PGNpcmNsZSBjeD0iOTYuNSIgY3k9Ijk2LjUiIHI9IjEwIiBmaWxsPSIjMTA4Y2VlIj48YW5pbWF0ZSBjYWxjTW9kZT0ic3BsaW5lIiBrZXlUaW1lcz0iMDsgMSIga2V5U3BsaW5lcz0iLjkgMCAuMyAxIiBhdHRyaWJ1dGVOYW1lPSJjeCIgZnJvbT0iOTYuNSIgdG89IjE1OC41IiBiZWdpbj0iMHM7IHNlY29uZC5lbmQgKyAwLjciIGR1cj0iMC41cyIgZmlsbCA9ICJmcmVlemUiLz48YW5pbWF0ZSBjYWxjTW9kZT0ic3BsaW5lIiBrZXlUaW1lcz0iMDsgMSIga2V5U3BsaW5lcz0iLjkgMCAuMyAxIiBhdHRyaWJ1dGVOYW1lPSJjeSIgZnJvbT0iOTYuNSIgdG89IjYwLjUiIGJlZ2luPSIwczsgc2Vjb25kLmVuZCArIDAuNyIgZHVyPSIwLjVzIiBmaWxsID0gImZyZWV6ZSIvPjxhbmltYXRlIGNhbGNNb2RlPSJzcGxpbmUiIGtleVRpbWVzPSIwOyAxIiBrZXlTcGxpbmVzPSIuOSAwIC4zIDEiIGF0dHJpYnV0ZU5hbWU9InIiICB0bz0iMjAiIGJlZ2luPSIwczsgc2Vjb25kLmVuZCArIDAuNyIgZHVyPSIwLjVzIiBmaWxsID0gImZyZWV6ZSIvPjxhbmltYXRlIGNhbGNNb2RlPSJzcGxpbmUiIGtleVRpbWVzPSIwOyAxIiBrZXlTcGxpbmVzPSIuOSAwIC4zIDEiIGF0dHJpYnV0ZU5hbWU9ImN4IiBmcm9tPSIxNTguNSIgdG89Ijk2LjUiIGJlZ2luPSJmaXJzdC5lbmQgKyAxLjIiIGR1cj0iMC41cyIgZmlsbCA9ICJmcmVlemUiLz48YW5pbWF0ZSBjYWxjTW9kZT0ic3BsaW5lIiBrZXlUaW1lcz0iMDsgMSIga2V5U3BsaW5lcz0iLjkgMCAuMyAxIiBhdHRyaWJ1dGVOYW1lPSJjeSIgZnJvbT0iNjAuNSIgdG89Ijk2LjUiIGJlZ2luPSJmaXJzdC5lbmQgKyAxLjIiIGR1cj0iMC41cyIgZmlsbCA9ICJmcmVlemUiLz48YW5pbWF0ZSBjYWxjTW9kZT0ic3BsaW5lIiBrZXlUaW1lcz0iMDsgMSIga2V5U3BsaW5lcz0iLjkgMCAuMyAxIiBhdHRyaWJ1dGVOYW1lPSJyIiAgdG89IjEwIiBiZWdpbj0iZmlyc3QuZW5kICsgMS4yIiBkdXI9IjAuNXMiIGZpbGwgPSAiZnJlZXplIi8+PC9jaXJjbGU+PGNpcmNsZSBjeD0iOTYuNSIgY3k9Ijk2LjUiIHI9IjEwIiBmaWxsPSIjMTA4Y2VlIj48YW5pbWF0ZSBjYWxjTW9kZT0ic3BsaW5lIiBrZXlUaW1lcz0iMDsgMSIga2V5U3BsaW5lcz0iLjkgMCAuMyAxIiBhdHRyaWJ1dGVOYW1lPSJjeCIgZnJvbT0iOTYuNSIgdG89IjE1OC41IiBiZWdpbj0iMHM7IHNlY29uZC5lbmQgKyAwLjciIGR1cj0iMC41cyIgZmlsbCA9ICJmcmVlemUiLz48YW5pbWF0ZSBjYWxjTW9kZT0ic3BsaW5lIiBrZXlUaW1lcz0iMDsgMSIga2V5U3BsaW5lcz0iLjkgMCAuMyAxIiBhdHRyaWJ1dGVOYW1lPSJjeSIgZnJvbT0iOTYuNSIgdG89IjEzMiIgYmVnaW49IjBzOyBzZWNvbmQuZW5kICsgMC43IiBkdXI9IjAuNXMiIGZpbGwgPSAiZnJlZXplIi8+PGFuaW1hdGUgY2FsY01vZGU9InNwbGluZSIga2V5VGltZXM9IjA7IDEiIGtleVNwbGluZXM9Ii45IDAgLjMgMSIgYXR0cmlidXRlTmFtZT0iciIgIHRvPSIyMCIgYmVnaW49IjBzOyBzZWNvbmQuZW5kICsgMC43IiBkdXI9IjAuNXMiIGZpbGwgPSAiZnJlZXplIi8+PGFuaW1hdGUgY2FsY01vZGU9InNwbGluZSIga2V5VGltZXM9IjA7IDEiIGtleVNwbGluZXM9Ii45IDAgLjMgMSIgYXR0cmlidXRlTmFtZT0iY3giIGZyb209IjE1OC41IiB0bz0iOTYuNSIgYmVnaW49ImZpcnN0LmVuZCArIDEuMiIgZHVyPSIwLjVzIiBmaWxsID0gImZyZWV6ZSIvPjxhbmltYXRlIGNhbGNNb2RlPSJzcGxpbmUiIGtleVRpbWVzPSIwOyAxIiBrZXlTcGxpbmVzPSIuOSAwIC4zIDEiIGF0dHJpYnV0ZU5hbWU9ImN5IiBmcm9tPSIxMzIiIHRvPSI5Ni41IiBiZWdpbj0iZmlyc3QuZW5kICsgMS4yIiBkdXI9IjAuNXMiIGZpbGwgPSAiZnJlZXplIi8+PGFuaW1hdGUgY2FsY01vZGU9InNwbGluZSIga2V5VGltZXM9IjA7IDEiIGtleVNwbGluZXM9Ii45IDAgLjMgMSIgYXR0cmlidXRlTmFtZT0iciIgIHRvPSIxMCIgYmVnaW49ImZpcnN0LmVuZCArIDEuMiIgZHVyPSIwLjVzIiBmaWxsID0gImZyZWV6ZSIvPjwvY2lyY2xlPjxjaXJjbGUgY3g9Ijk2LjUiIGN5PSI5Ni41IiByPSIxMCIgZmlsbD0iIzEwOGNlZSI+PGFuaW1hdGUgY2FsY01vZGU9InNwbGluZSIga2V5VGltZXM9IjA7IDEiIGtleVNwbGluZXM9Ii45IDAgLjMgMSIgYXR0cmlidXRlTmFtZT0iY3kiIGZyb209Ijk2LjUiIHRvPSIxNjcuNSIgYmVnaW49IjBzOyBzZWNvbmQuZW5kICsgMC43IiBkdXI9IjAuNXMiIGZpbGwgPSAiZnJlZXplIi8+PGFuaW1hdGUgY2FsY01vZGU9InNwbGluZSIga2V5VGltZXM9IjA7IDEiIGtleVNwbGluZXM9Ii45IDAgLjMgMSIgYXR0cmlidXRlTmFtZT0iciIgIHRvPSIyMCIgYmVnaW49IjBzOyBzZWNvbmQuZW5kICsgMC43IiBkdXI9IjAuNXMiIGZpbGwgPSAiZnJlZXplIi8+PGFuaW1hdGUgY2FsY01vZGU9InNwbGluZSIga2V5VGltZXM9IjA7IDEiIGtleVNwbGluZXM9Ii45IDAgLjMgMSIgYXR0cmlidXRlTmFtZT0iY3kiIGZyb209IjE2Ny41IiB0bz0iOTYuNSIgYmVnaW49ImZpcnN0LmVuZCArIDEuMiIgZHVyPSIwLjVzIiBmaWxsID0gImZyZWV6ZSIvPjxhbmltYXRlIGNhbGNNb2RlPSJzcGxpbmUiIGtleVRpbWVzPSIwOyAxIiBrZXlTcGxpbmVzPSIuOSAwIC4zIDEiIGF0dHJpYnV0ZU5hbWU9InIiICB0bz0iMTAiIGJlZ2luPSJmaXJzdC5lbmQgKyAxLjIiIGR1cj0iMC41cyIgZmlsbCA9ICJmcmVlemUiLz48L2NpcmNsZT48Y2lyY2xlIGN4PSI5Ni41IiBjeT0iOTYuNSIgcj0iMTAiIGZpbGw9IiMxMDhjZWUiPjxhbmltYXRlIGNhbGNNb2RlPSJzcGxpbmUiIGtleVRpbWVzPSIwOyAxIiBrZXlTcGxpbmVzPSIuOSAwIC4zIDEiIGF0dHJpYnV0ZU5hbWU9ImN4IiBmcm9tPSI5Ni41IiB0bz0iMzQuNSIgYmVnaW49IjBzOyBzZWNvbmQuZW5kICsgMC43IiBkdXI9IjAuNXMiIGZpbGwgPSAiZnJlZXplIi8+PGFuaW1hdGUgY2FsY01vZGU9InNwbGluZSIga2V5VGltZXM9IjA7IDEiIGtleVNwbGluZXM9Ii45IDAgLjMgMSIgYXR0cmlidXRlTmFtZT0iY3kiIGZyb209Ijk2LjUiIHRvPSIxMzIiIGJlZ2luPSIwczsgc2Vjb25kLmVuZCArIDAuNyIgZHVyPSIwLjVzIiBmaWxsID0gImZyZWV6ZSIvPjxhbmltYXRlIGNhbGNNb2RlPSJzcGxpbmUiIGtleVRpbWVzPSIwOyAxIiBrZXlTcGxpbmVzPSIuOSAwIC4zIDEiIGF0dHJpYnV0ZU5hbWU9InIiICB0bz0iMjAiIGJlZ2luPSIwczsgc2Vjb25kLmVuZCArIDAuNyIgZHVyPSIwLjVzIiBmaWxsID0gImZyZWV6ZSIvPjxhbmltYXRlIGNhbGNNb2RlPSJzcGxpbmUiIGtleVRpbWVzPSIwOyAxIiBrZXlTcGxpbmVzPSIuOSAwIC4zIDEiIGF0dHJpYnV0ZU5hbWU9ImN4IiBmcm9tPSIzNC41IiB0bz0iOTYuNSIgYmVnaW49ImZpcnN0LmVuZCArIDEuMiIgZHVyPSIwLjVzIiBmaWxsID0gImZyZWV6ZSIvPjxhbmltYXRlIGNhbGNNb2RlPSJzcGxpbmUiIGtleVRpbWVzPSIwOyAxIiBrZXlTcGxpbmVzPSIuOSAwIC4zIDEiIGF0dHJpYnV0ZU5hbWU9ImN5IiBmcm9tPSIxMzIiIHRvPSI5Ni41IiBiZWdpbj0iZmlyc3QuZW5kICsgMS4yIiBkdXI9IjAuNXMiIGZpbGwgPSAiZnJlZXplIi8+PGFuaW1hdGUgY2FsY01vZGU9InNwbGluZSIga2V5VGltZXM9IjA7IDEiIGtleVNwbGluZXM9Ii45IDAgLjMgMSIgYXR0cmlidXRlTmFtZT0iciIgIHRvPSIxMCIgYmVnaW49ImZpcnN0LmVuZCArIDEuMiIgZHVyPSIwLjVzIiBmaWxsID0gImZyZWV6ZSIvPjwvY2lyY2xlPjwvc3ZnPg==');
 
   --Crud-toolbar-gap: #{px2rem(10px)};
@@ -426,6 +434,14 @@ $L1: 0px 4px 6px 0px rgba(8, 14, 26, 0.06),
   --ImageControl-progress-borderRadius: #{$R2};
 
   // 文件上传
+  --FileControl-danger-color: #{$E6};
+  --FileControl-drag-color: #{$G3};
+  --FileControl-icon-onHover-color: #{$G4};
+  --FileControl-icon-color: #{$G5};
+  --FileControl-onDisabled-color: #{$G6};
+  --FileControl-border-color: #{$G8};
+  --FileControl-onHover-bg: #{$G9};
+  --FileControl-onDisabled-bg: #{$G10};
   --FileControl-progress-borderRadius: #{$R2};
 
   // Modal
@@ -488,11 +504,15 @@ $L1: 0px 4px 6px 0px rgba(8, 14, 26, 0.06),
 
   // Tabs
   --Tabs-linkFontSize: #{px2rem(14px)};
+  --Tabs-link-disabled-color: #{$G6};
   --Tabs--card-onActive-borderColor: var(--white);
   --Tabs--card-bg: var(--Table-thead-bg);
   --Tabs--radio-bg: var(--white);
   --Tabs--chrome-onHover-bg: #fcfcfc;
   --Tabs--chrome-bg: #f5f5f5;
+  --Tabs--simple-split-color: #{$G9};
+  --Tabs--simple-split-size: var(--gap-xs) var(--gap-md);
+  --Tabs--sidebar-iconColor: #{$B6};
 
   // Pagination
   --Pagination-fontSize: #{px2rem(12px)};