@sdata/web-vue 1.6.0 → 1.7.0

package/es/style/animation/{zoom.less → zoom.scss}

@@ -1,4 +1,4 @@
-@import url('../theme/index.less');
+@use '@style/theme/index.scss' as *;
 
 // modal use
 .zoom-in-enter-from,
@@ -16,8 +16,8 @@
 .zoom-in-enter-active,
 .zoom-in-appear-active {
   transition:
-    opacity @transition-duration-3 @transition-timing-function-standard,
-    transform @transition-duration-3 @transition-timing-function-standard;
+    opacity $transition-duration-3 $transition-timing-function-standard,
+    transform $transition-duration-3 $transition-timing-function-standard;
 }
 
 .zoom-in-leave-from {
@@ -32,8 +32,8 @@
 
 .zoom-in-leave-active {
   transition:
-    opacity @transition-duration-3 @transition-timing-function-standard,
-    transform @transition-duration-3 @transition-timing-function-standard;
+    opacity $transition-duration-3 $transition-timing-function-standard,
+    transform $transition-duration-3 $transition-timing-function-standard;
 }
 
 // used by tooltip。缩放出现，渐隐退出
@@ -52,8 +52,8 @@
 .zoom-in-fade-out-enter-active,
 .zoom-in-fade-out-appear-active {
   transition:
-    opacity @transition-duration-3 @transition-timing-function-overshoot,
-    transform @transition-duration-3 @transition-timing-function-overshoot;
+    opacity $transition-duration-3 $transition-timing-function-overshoot,
+    transform $transition-duration-3 $transition-timing-function-overshoot;
 }
 
 .zoom-in-fade-out-leave-from {
@@ -68,8 +68,8 @@
 
 .zoom-in-fade-out-leave-active {
   transition:
-    opacity @transition-duration-3 @transition-timing-function-overshoot,
-    transform @transition-duration-3 @transition-timing-function-overshoot;
+    opacity $transition-duration-3 $transition-timing-function-overshoot,
+    transform $transition-duration-3 $transition-timing-function-overshoot;
 }
 
 // used by slide, table filter
@@ -88,8 +88,8 @@
 .zoom-in-big-enter-active,
 .zoom-in-big-appear-active {
   transition:
-    opacity @transition-duration-2 @transition-timing-function-linear,
-    transform @transition-duration-2 @transition-timing-function-linear;
+    opacity $transition-duration-2 $transition-timing-function-linear,
+    transform $transition-duration-2 $transition-timing-function-linear;
 }
 
 .zoom-in-big-leave-from {
@@ -104,8 +104,8 @@
 
 .zoom-in-big-leave-active {
   transition:
-    opacity @transition-duration-2 @transition-timing-function-linear,
-    transform @transition-duration-2 @transition-timing-function-linear;
+    opacity $transition-duration-2 $transition-timing-function-linear,
+    transform $transition-duration-2 $transition-timing-function-linear;
 }
 
 .zoom-in-left-enter-from,
@@ -124,8 +124,8 @@
 .zoom-in-left-appear-active {
   transform-origin: 0 50%;
   transition:
-    opacity @transition-duration-3 @transition-timing-function-linear,
-    transform @transition-duration-3 @transition-timing-function-overshoot;
+    opacity $transition-duration-3 $transition-timing-function-linear,
+    transform $transition-duration-3 $transition-timing-function-overshoot;
 }
 
 .zoom-in-left-leave-from {
@@ -141,8 +141,8 @@
 .zoom-in-left-leave-active {
   transform-origin: 0 50%;
   transition:
-    opacity @transition-duration-3 @transition-timing-function-linear,
-    transform @transition-duration-3 @transition-timing-function-overshoot;
+    opacity $transition-duration-3 $transition-timing-function-linear,
+    transform $transition-duration-3 $transition-timing-function-overshoot;
 }
 
 // used by alert form
@@ -162,8 +162,8 @@
 .zoom-in-top-appear-active {
   transform-origin: 0 0;
   transition:
-    transform @transition-duration-3 @transition-timing-function-overshoot,
-    opacity @transition-duration-3 @transition-timing-function-overshoot;
+    transform $transition-duration-3 $transition-timing-function-overshoot,
+    opacity $transition-duration-3 $transition-timing-function-overshoot;
 }
 
 .zoom-in-top-leave-from {
@@ -179,8 +179,8 @@
 .zoom-in-top-leave-active {
   transform-origin: 0 0;
   transition:
-    transform @transition-duration-3 @transition-timing-function-overshoot,
-    opacity @transition-duration-3 @transition-timing-function-overshoot;
+    transform $transition-duration-3 $transition-timing-function-overshoot,
+    opacity $transition-duration-3 $transition-timing-function-overshoot;
 }
 
 .zoom-in-bottom-enter-from,
@@ -199,8 +199,8 @@
 .zoom-in-bottom-appear-active {
   transform-origin: 100% 100%;
   transition:
-    transform @transition-duration-3 @transition-timing-function-overshoot,
-    opacity @transition-duration-3 @transition-timing-function-overshoot;
+    transform $transition-duration-3 $transition-timing-function-overshoot,
+    opacity $transition-duration-3 $transition-timing-function-overshoot;
 }
 
 .zoom-in-bottom-leave-from {
@@ -216,6 +216,6 @@
 .zoom-in-bottom-leave-active {
   transform-origin: 100% 100%;
   transition:
-    transform @transition-duration-3 @transition-timing-function-overshoot,
-    opacity @transition-duration-3 @transition-timing-function-overshoot;
+    transform $transition-duration-3 $transition-timing-function-overshoot,
+    opacity $transition-duration-3 $transition-timing-function-overshoot;
 }

package/es/style/base.scss

@@ -0,0 +1,18 @@
+@use './theme/tokens.scss' as theme;
+
+body {
+  color: rgb(#{theme.$sd-color-primary-6});
+  font-size: 14px;
+  font-family:
+    Inter,
+    -apple-system,
+    BlinkMacSystemFont,
+    'PingFang SC',
+    'Hiragino Sans GB',
+    'noto sans',
+    'Microsoft YaHei',
+    'Helvetica Neue',
+    Helvetica,
+    Arial,
+    sans-serif;
+}

package/es/style/color/colors.scss

@@ -0,0 +1,405 @@
+@use 'sass:string';
+$sd-vars-prefix: string.unquote('');
+$sd-cssvars-prefix: string.unquote('-');
+
+@if $sd-vars-prefix != string.unquote('') {
+  $sd-cssvars-prefix: string.unquote('--#{$sd-vars-prefix}');
+}
+
+$red-1: #ffece8;
+$red-2: #fdcdc5;
+$red-3: #fbaca3;
+$red-4: #f98981;
+$red-5: #f76560;
+$red-6: #f53f3f;
+$red-7: #cb272d;
+$red-8: #a1151e;
+$red-9: #770813;
+$red-10: #4d000a;
+$orangered-1: #fff3e8;
+$orangered-2: #fdddc3;
+$orangered-3: #fcc59f;
+$orangered-4: #faac7b;
+$orangered-5: #f99057;
+$orangered-6: #f77234;
+$orangered-7: #cc5120;
+$orangered-8: #a23511;
+$orangered-9: #771f06;
+$orangered-10: #4d0e00;
+$orange-1: #fff7e8;
+$orange-2: #ffe4ba;
+$orange-3: #ffcf8b;
+$orange-4: #ffb65d;
+$orange-5: #ff9a2e;
+$orange-6: #ff7d00;
+$orange-7: #d25f00;
+$orange-8: #a64500;
+$orange-9: #792e00;
+$orange-10: #4d1b00;
+$gold-1: #fffce8;
+$gold-2: #fdf4bf;
+$gold-3: #fce996;
+$gold-4: #fadc6d;
+$gold-5: #f9cc45;
+$gold-6: #f7ba1e;
+$gold-7: #cc9213;
+$gold-8: #a26d0a;
+$gold-9: #774b04;
+$gold-10: #4d2d00;
+$yellow-1: #feffe8;
+$yellow-2: #fefebe;
+$yellow-3: #fdfa94;
+$yellow-4: #fcf26b;
+$yellow-5: #fbe842;
+$yellow-6: #fadc19;
+$yellow-7: #cfaf0f;
+$yellow-8: #a38408;
+$yellow-9: #785d03;
+$yellow-10: #4d3800;
+$lime-1: #fcffe8;
+$lime-2: #edf8bb;
+$lime-3: #dcf190;
+$lime-4: #c9e968;
+$lime-5: #b5e241;
+$lime-6: #9fdb1d;
+$lime-7: #7eb712;
+$lime-8: #5f940a;
+$lime-9: #437004;
+$lime-10: #2a4d00;
+$green-1: #e8ffea;
+$green-2: #aff0b5;
+$green-3: #7be188;
+$green-4: #4cd263;
+$green-5: #23c343;
+$green-6: #00b42a;
+$green-7: #009a29;
+$green-8: #008026;
+$green-9: #062;
+$green-10: #004d1c;
+$cyan-1: #e8fffb;
+$cyan-2: #b7f4ec;
+$cyan-3: #89e9e0;
+$cyan-4: #5edfd6;
+$cyan-5: #37d4cf;
+$cyan-6: #14c9c9;
+$cyan-7: #0da5aa;
+$cyan-8: #07828b;
+$cyan-9: #03616c;
+$cyan-10: #00424d;
+$blue-1: #e8f7ff;
+$blue-2: #c3e7fe;
+$blue-3: #9fd4fd;
+$blue-4: #7bc0fc;
+$blue-5: #57a9fb;
+$blue-6: #3491fa;
+$blue-7: #206ccf;
+$blue-8: #114ba3;
+$blue-9: #063078;
+$blue-10: #001a4d;
+$sdblue-1: #e8f3ff;
+$sdblue-2: #bedaff;
+$sdblue-3: #94bfff;
+$sdblue-4: #6aa1ff;
+$sdblue-5: #4080ff;
+$sdblue-6: #165dff;
+$sdblue-7: #0e42d2;
+$sdblue-8: #072ca6;
+$sdblue-9: #031a79;
+$sdblue-10: #000d4d;
+$purple-1: #f5e8ff;
+$purple-2: #ddbef6;
+$purple-3: #c396ed;
+$purple-4: #a871e3;
+$purple-5: #8d4eda;
+$purple-6: #722ed1;
+$purple-7: #551db0;
+$purple-8: #3c108f;
+$purple-9: #27066e;
+$purple-10: #16004d;
+$pinkpurple-1: #ffe8fb;
+$pinkpurple-2: #f7baef;
+$pinkpurple-3: #f08ee6;
+$pinkpurple-4: #e865df;
+$pinkpurple-5: #e13edb;
+$pinkpurple-6: #d91ad9;
+$pinkpurple-7: #b010b6;
+$pinkpurple-8: #8a0993;
+$pinkpurple-9: #650370;
+$pinkpurple-10: #42004d;
+$magenta-1: #ffe8f1;
+$magenta-2: #fdc2db;
+$magenta-3: #fb9dc7;
+$magenta-4: #f979b7;
+$magenta-5: #f754a8;
+$magenta-6: #f5319d;
+$magenta-7: #cb1e83;
+$magenta-8: #a11069;
+$magenta-9: #77064f;
+$magenta-10: #4d0034;
+$gray-1: #f7f8fa;
+$gray-2: #f2f3f5;
+$gray-3: #e5e6eb;
+$gray-4: #c9cdd4;
+$gray-5: #a9aeb8;
+$gray-6: #86909c;
+$gray-7: #6b7785;
+$gray-8: #4e5969;
+$gray-9: #272e3b;
+$gray-10: #1d2129;
+
+// dark
+$dark-red-1: #4d000a;
+$dark-red-2: #770611;
+$dark-red-3: #a1161f;
+$dark-red-4: #cb2e34;
+$dark-red-5: #f54e4e;
+$dark-red-6: #f76965;
+$dark-red-7: #f98d86;
+$dark-red-8: #fbb0a7;
+$dark-red-9: #fdd1ca;
+$dark-red-10: #fff0ec;
+$dark-orangered-1: #4d0e00;
+$dark-orangered-2: #771e05;
+$dark-orangered-3: #a23714;
+$dark-orangered-4: #cc5729;
+$dark-orangered-5: #f77e45;
+$dark-orangered-6: #f9925a;
+$dark-orangered-7: #faad7d;
+$dark-orangered-8: #fcc6a1;
+$dark-orangered-9: #fddec5;
+$dark-orangered-10: #fff4eb;
+$dark-orange-1: #4d1b00;
+$dark-orange-2: #793004;
+$dark-orange-3: #a64b0a;
+$dark-orange-4: #d26913;
+$dark-orange-5: #ff8d1f;
+$dark-orange-6: #ff9626;
+$dark-orange-7: #ffb357;
+$dark-orange-8: #ffcd87;
+$dark-orange-9: #ffe3b8;
+$dark-orange-10: #fff7e8;
+$dark-gold-1: #4d2d00;
+$dark-gold-2: #774b04;
+$dark-gold-3: #a26f0f;
+$dark-gold-4: #cc961f;
+$dark-gold-5: #f7c034;
+$dark-gold-6: #f9cc44;
+$dark-gold-7: #fadc6c;
+$dark-gold-8: #fce995;
+$dark-gold-9: #fdf4be;
+$dark-gold-10: #fffce8;
+$dark-yellow-1: #4d3800;
+$dark-yellow-2: #785e07;
+$dark-yellow-3: #a38614;
+$dark-yellow-4: #cfb325;
+$dark-yellow-5: #fae13c;
+$dark-yellow-6: #fbe94b;
+$dark-yellow-7: #fcf374;
+$dark-yellow-8: #fdfa9d;
+$dark-yellow-9: #fefec6;
+$dark-yellow-10: #fefff0;
+$dark-lime-1: #2a4d00;
+$dark-lime-2: #447006;
+$dark-lime-3: #629412;
+$dark-lime-4: #84b723;
+$dark-lime-5: #a8db39;
+$dark-lime-6: #b8e24b;
+$dark-lime-7: #cbe970;
+$dark-lime-8: #def198;
+$dark-lime-9: #eef8c2;
+$dark-lime-10: #fdffee;
+$dark-green-1: #004d1c;
+$dark-green-2: #046625;
+$dark-green-3: #0a802d;
+$dark-green-4: #129a37;
+$dark-green-5: #1db440;
+$dark-green-6: #27c346;
+$dark-green-7: #50d266;
+$dark-green-8: #7ee18b;
+$dark-green-9: #b2f0b7;
+$dark-green-10: #ebffec;
+$dark-cyan-1: #00424d;
+$dark-cyan-2: #06616c;
+$dark-cyan-3: #11838b;
+$dark-cyan-4: #1fa6aa;
+$dark-cyan-5: #30c9c9;
+$dark-cyan-6: #3fd4cf;
+$dark-cyan-7: #66dfd7;
+$dark-cyan-8: #90e9e1;
+$dark-cyan-9: #bef4ed;
+$dark-cyan-10: #f0fffc;
+$dark-blue-1: #001a4d;
+$dark-blue-2: #052f78;
+$dark-blue-3: #134ca3;
+$dark-blue-4: #2971cf;
+$dark-blue-5: #469afa;
+$dark-blue-6: #5aaafb;
+$dark-blue-7: #7dc1fc;
+$dark-blue-8: #a1d5fd;
+$dark-blue-9: #c6e8fe;
+$dark-blue-10: #eaf8ff;
+$dark-sdblue-1: #000d4d;
+$dark-sdblue-2: #041b79;
+$dark-sdblue-3: #0e32a6;
+$dark-sdblue-4: #1d4dd2;
+$dark-sdblue-5: #306fff;
+$dark-sdblue-6: #3c7eff;
+$dark-sdblue-7: #689fff;
+$dark-sdblue-8: #93beff;
+$dark-sdblue-9: #bedaff;
+$dark-sdblue-10: #eaf4ff;
+$dark-purple-1: #16004d;
+$dark-purple-2: #27066e;
+$dark-purple-3: #3e138f;
+$dark-purple-4: #5a25b0;
+$dark-purple-5: #7b3dd1;
+$dark-purple-6: #8e51da;
+$dark-purple-7: #a974e3;
+$dark-purple-8: #c59aed;
+$dark-purple-9: #dfc2f6;
+$dark-purple-10: #f7edff;
+$dark-pinkpurple-1: #42004d;
+$dark-pinkpurple-2: #650370;
+$dark-pinkpurple-3: #8a0d93;
+$dark-pinkpurple-4: #b01bb6;
+$dark-pinkpurple-5: #d92ed9;
+$dark-pinkpurple-6: #e13ddb;
+$dark-pinkpurple-7: #e866df;
+$dark-pinkpurple-8: #f092e6;
+$dark-pinkpurple-9: #f7c1f0;
+$dark-pinkpurple-10: #fff2fd;
+$dark-magenta-1: #4d0034;
+$dark-magenta-2: #770850;
+$dark-magenta-3: #a1176c;
+$dark-magenta-4: #cb2b88;
+$dark-magenta-5: #f545a6;
+$dark-magenta-6: #f756a9;
+$dark-magenta-7: #f97ab8;
+$dark-magenta-8: #fb9ec8;
+$dark-magenta-9: #fdc3db;
+$dark-magenta-10: #ffe8f1;
+$dark-gray-1: #17171a;
+$dark-gray-2: #2e2e30;
+$dark-gray-3: #484849;
+$dark-gray-4: #5f5f60;
+$dark-gray-5: #78787a;
+$dark-gray-6: #929293;
+$dark-gray-7: #ababac;
+$dark-gray-8: #c5c5c5;
+$dark-gray-9: #dfdfdf;
+$dark-gray-10: #f6f6f6;
+
+// 命名具有具体含义，从预置色板取值
+$primary-1: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-1')));
+$primary-2: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-2')));
+$primary-3: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-3')));
+$primary-4: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-4')));
+$primary-5: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-5')));
+$primary-6: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-6')));
+$primary-7: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-7')));
+$primary-8: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-8')));
+$primary-9: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-9')));
+$primary-10: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-10')));
+
+$dark-primary-1: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-1')));
+$dark-primary-2: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-2')));
+$dark-primary-3: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-3')));
+$dark-primary-4: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-4')));
+$dark-primary-5: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-5')));
+$dark-primary-6: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-6')));
+$dark-primary-7: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-7')));
+$dark-primary-8: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-8')));
+$dark-primary-9: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-9')));
+$dark-primary-10: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-10')));
+
+// 成功色
+$success-1: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-1')));
+$success-2: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-2')));
+$success-3: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-3')));
+$success-4: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-4')));
+$success-5: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-5')));
+$success-6: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-6')));
+$success-7: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-7')));
+$success-8: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-8')));
+$success-9: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-9')));
+$success-10: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-10')));
+
+$dark-success-1: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-1')));
+$dark-success-2: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-2')));
+$dark-success-3: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-3')));
+$dark-success-4: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-4')));
+$dark-success-5: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-5')));
+$dark-success-6: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-6')));
+$dark-success-7: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-7')));
+$dark-success-8: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-8')));
+$dark-success-9: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-9')));
+$dark-success-10: rgb(var(string.unquote('#{$sd-cssvars-prefix}-green-10')));
+
+// 错误色
+$danger-1: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-1')));
+$danger-2: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-2')));
+$danger-3: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-3')));
+$danger-4: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-4')));
+$danger-5: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-5')));
+$danger-6: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-6')));
+$danger-7: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-7')));
+$danger-8: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-8')));
+$danger-9: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-9')));
+$danger-10: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-10')));
+
+$dark-danger-1: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-1')));
+$dark-danger-2: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-2')));
+$dark-danger-3: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-3')));
+$dark-danger-4: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-4')));
+$dark-danger-5: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-5')));
+$dark-danger-6: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-6')));
+$dark-danger-7: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-7')));
+$dark-danger-8: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-8')));
+$dark-danger-9: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-9')));
+$dark-danger-10: rgb(var(string.unquote('#{$sd-cssvars-prefix}-red-10')));
+
+// 警示色
+$warning-1: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-1')));
+$warning-2: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-2')));
+$warning-3: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-3')));
+$warning-4: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-4')));
+$warning-5: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-5')));
+$warning-6: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-6')));
+$warning-7: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-7')));
+$warning-8: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-8')));
+$warning-9: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-9')));
+$warning-10: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-10')));
+
+$dark-warning-1: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-1')));
+$dark-warning-2: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-2')));
+$dark-warning-3: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-3')));
+$dark-warning-4: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-4')));
+$dark-warning-5: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-5')));
+$dark-warning-6: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-6')));
+$dark-warning-7: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-7')));
+$dark-warning-8: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-8')));
+$dark-warning-9: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-9')));
+$dark-warning-10: rgb(var(string.unquote('#{$sd-cssvars-prefix}-orange-10')));
+
+// 链接色
+$link-1: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-1')));
+$link-2: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-2')));
+$link-3: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-3')));
+$link-4: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-4')));
+$link-5: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-5')));
+$link-6: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-6')));
+$link-7: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-7')));
+$link-8: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-8')));
+$link-9: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-9')));
+$link-10: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-10')));
+
+$dark-link-1: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-1')));
+$dark-link-2: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-2')));
+$dark-link-3: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-3')));
+$dark-link-4: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-4')));
+$dark-link-5: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-5')));
+$dark-link-6: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-6')));
+$dark-link-7: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-7')));
+$dark-link-8: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-8')));
+$dark-link-9: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-9')));
+$dark-link-10: rgb(var(string.unquote('#{$sd-cssvars-prefix}-sdblue-10')));