earthnut 0.2.3-alpha.2 → 1.0.0

package/styles/vars-color.scss

@@ -1,247 +1,295 @@
-$color-white: #ffffff;
-$en-color-neutral-light-70: #f9f9fb;
-$en-color-neutral-light-80: #f2f1f1;
-$en-color-neutral-light-90: #ebeaea;
+// 亮度值
 
-$en-color-neutral-10: #e2e2e2;
-$en-color-neutral-20: #cdcdcd;
-$en-color-neutral-30: #b3b3b3;
-$en-color-neutral-40: #9e9e9e;
-$en-color-neutral-50: #858585;
-$en-color-neutral-60: #696969;
-$en-color-neutral-70: #4e4e4e;
-$en-color-neutral-75: #313131;
-$en-color-neutral-80: #343434;
-$en-color-neutral-90: #1b1b1b;
+// function a(str,...other) {
+//     str =str[0];
 
-$en-color-light-blue: #0085f2;
-$en-color-light-green: #009a46;
-$en-color-light-yellow: #928700;
-$en-color-light-red: #d30038;
-$en-color-light-violet: #9b65ff;
-$en-color-light-pink: #d00058;
+//     return str.split(';').map(e=> e.trim()).filter(e=> e.length > 5).reduce((v,e)=> {
+//         const [tag, item] = e.split(':').map(e=> e.trim());
+//         const r = Number('0x' + item.slice(1,3));
+//         const g = Number('0x' + item.slice(3,5));
+//         const b = Number('0x' + item.slice(5));
+//         return v + e + ';' + tag + '-rgb' + ':' + r + ',' + g + ',' + b + ';'
+//     },'');
+// }
 
-$en-color-dark-blue: $en-color-light-blue;
-$en-color-dark-green: $en-color-light-green;
-$en-color-dark-yellow: $en-color-light-yellow;
-$en-color-dark-red: $en-color-light-red;
-$en-color-dark-violet: $en-color-light-violet;
-$en-color-dark-pink: $en-color-light-pink;
+$en-color-darkness-10: #fefefe;
+$en-color-darkness-10-rgb: 251, 251, 251;
+$en-color-darkness-15: #efefef;
+$en-color-darkness-15-rgb: 235, 235, 235;
+$en-color-darkness-20: #e0e0e0;
+$en-color-darkness-20-rgb: 219, 219, 219;
+$en-color-darkness-25: #d3d3d3;
+$en-color-darkness-25-rgb: 203, 203, 203;
+$en-color-darkness-30: #c3c3c3;
+$en-color-darkness-30-rgb: 188, 188, 188;
+$en-color-darkness-35: #b3b3b3;
+$en-color-darkness-35-rgb: 172, 172, 172;
+$en-color-darkness-40: #a3a3a3;
+$en-color-darkness-40-rgb: 156, 156, 156;
+$en-color-darkness-45: #939393;
+$en-color-darkness-45-rgb: 141, 141, 141;
+$en-color-darkness-50: #838383;
+$en-color-darkness-50-rgb: 125, 125, 125;
+$en-color-darkness-55: #737373;
+$en-color-darkness-55-rgb: 110, 110, 110;
+$en-color-darkness-60: #636363;
+$en-color-darkness-60-rgb: 94, 94, 94;
+$en-color-darkness-65: #535353;
+$en-color-darkness-65-rgb: 79, 79, 79;
+$en-color-darkness-70: #434343;
+$en-color-darkness-70-rgb: 64, 64, 64;
+$en-color-darkness-75: #333333;
+$en-color-darkness-75-rgb: 49, 49, 49;
+$en-color-darkness-80: #232323;
+$en-color-darkness-80-rgb: 34, 34, 34;
+$en-color-darkness-85: #131313;
+$en-color-darkness-85-rgb: 19, 19, 19;
+$en-color-darkness-90: #030303;
+$en-color-darkness-90-rgb: 3, 3, 3;
+//  纯色
+$en-color-blue: #0085f2;
+$en-color-blue-rgb: 0, 133, 242;
+$en-color-cyan: #36cfc9;
+$en-color-cyan-rgb: 54, 207, 201;
+$en-color-lime: #bae637;
+$en-color-lime-rgb: 186, 230, 55;
+$en-color-green: #009a46;
+$en-color-green-rgb: 0, 154, 70;
+$en-color-yellow: #928700;
+$en-color-yellow-rgb: 146, 135, 0;
+$en-color-volcano: #ff7a45;
+$en-color-volcano-rgb: 255, 122, 69;
+$en-color-gold: #ffc53d;
+$en-color-gold-rgb: 255, 197, 61;
+$en-color-orange: #ffa940;
+$en-color-orange-rgb: 255, 169, 64;
+$en-color-red: #d30038;
+$en-color-red-rgb: 211, 0, 56;
+$en-color-violet: #9b65ff;
+$en-color-violet-rgb: 155, 101, 255;
+$en-color-pink: #d00058;
+$en-color-pink-rgb: 208, 0, 88;
+$en-color-beige: #f0f2e6;
+$en-color-beige-rgb: 240, 242, 230;
+$en-color-black: #000000;
+$en-color-black-rgb: 0, 0, 0;
+$en-color-white: #ffffff;
+$en-color-white-rgb: 255, 255, 255;
+// mac 关闭按钮的色
+$en-color-close-button: rgb(252, 71, 70);
+$en-color-close-button-rgb: 252, 71, 70;
+// mac 关闭最小化的色
+$en-color-mini-size-button: rgb(245, 191, 79);
+$en-color-mini-size-button-rgb: 245, 191, 79;
+// mac 关闭最大化的色
+$en-color-full-size-button: rgb(99, 200, 86);
+$en-color-full-size-button-rgb: 99, 200, 86;
 
-$en-color-black: #000;
-$en-color-white: #fff;
-$en-color-ads: #00d0aa;
-$en-color-light-blue-10: #dce2f2;
-$en-color-light-blue-20: #c1cff1;
-$en-color-light-blue-30: #8cb4ff;
-$en-color-light-blue-40: #5e9eff;
-$en-color-light-blue-50: #0085f2;
-$en-color-light-blue-60: #0069c2;
-$en-color-light-blue-70: #004d92;
-$en-color-light-blue-80: #003465;
-$en-color-light-blue-90: #001b3a;
+$en-color-blue-10: #dce2f2;
+$en-color-blue-10-rgb: 220, 226, 242;
+$en-color-blue-20: #c1cff1;
+$en-color-blue-20-rgb: 193, 207, 241;
+$en-color-blue-30: #8cb4ff;
+$en-color-blue-30-rgb: 140, 180, 255;
+$en-color-blue-40: #5e9eff;
+$en-color-blue-40-rgb: 94, 158, 255;
+$en-color-blue-50: #0085f2;
+$en-color-blue-50-rgb: 0, 133, 242;
+$en-color-blue-60: #0069c2;
+$en-color-blue-60-rgb: 0, 105, 194;
+$en-color-blue-70: #004d92;
+$en-color-blue-70-rgb: 0, 77, 146;
+$en-color-blue-80: #003465;
+$en-color-blue-80-rgb: 0, 52, 101;
+$en-color-blue-90: #001b3a;
+$en-color-blue-90-rgb: 0, 27, 58;
 
-$en-color-dark-blue-10: $en-color-light-blue-10;
-$en-color-dark-blue-20: $en-color-light-blue-20;
-$en-color-dark-blue-30: $en-color-light-blue-30;
-$en-color-dark-blue-40: $en-color-light-blue-40;
-$en-color-dark-blue-50: $en-color-light-blue-50;
-$en-color-dark-blue-60: $en-color-light-blue-60;
-$en-color-dark-blue-70: $en-color-light-blue-70;
-$en-color-dark-blue-80: $en-color-light-blue-80;
-$en-color-dark-blue-90: $en-color-light-blue-90;
+$en-color-cyan-10: #e6fffb;
+$en-color-cyan-10-rgb: 230, 255, 251;
+$en-color-cyan-20: #b5f5ec;
+$en-color-cyan-20-rgb: 181, 245, 236;
+$en-color-cyan-30: #87e8de;
+$en-color-cyan-30-rgb: 135, 232, 222;
+$en-color-cyan-40: #5cdbd3;
+$en-color-cyan-40-rgb: 92, 219, 211;
+$en-color-cyan-50: #13c2c2;
+$en-color-cyan-50-rgb: 19, 194, 194;
+$en-color-cyan-60: #08979c;
+$en-color-cyan-60-rgb: 8, 151, 156;
+$en-color-cyan-70: #006d75;
+$en-color-cyan-70-rgb: 0, 109, 117;
+$en-color-cyan-80: #00474f;
+$en-color-cyan-80-rgb: 0, 71, 79;
+$en-color-cyan-90: #002329;
+$en-color-cyan-90-rgb: 0, 35, 41;
 
-$en-color-light-green-10: #a9f3ba;
-$en-color-light-green-20: #73e693;
-$en-color-light-green-30: #00d061;
-$en-color-light-green-40: #00b755;
-$en-color-light-green-50: #009a46;
-$en-color-light-green-60: #007936;
-$en-color-light-green-70: #005a26;
-$en-color-light-green-80: #003d18;
-$en-color-light-green-90: #00210a;
+$en-color-lime-10: #fcffe6;
+$en-color-lime-10-rgb: 252, 255, 230;
+$en-color-lime-20: #f4ffb8;
+$en-color-lime-20-rgb: 244, 255, 184;
+$en-color-lime-30: #eaff8f;
+$en-color-lime-30-rgb: 234, 255, 143;
+$en-color-lime-40: #d3f261;
+$en-color-lime-40-rgb: 211, 242, 97;
+$en-color-lime-50: #a0d911;
+$en-color-lime-50-rgb: 160, 217, 17;
+$en-color-lime-60: #7cb305;
+$en-color-lime-60-rgb: 124, 179, 5;
+$en-color-lime-70: #5b8c00;
+$en-color-lime-70-rgb: 91, 140, 0;
+$en-color-lime-80: #3f6600;
+$en-color-lime-80-rgb: 63, 102, 0;
+$en-color-lime-90: #254000;
+$en-color-lime-90-rgb: 37, 64, 0;
 
-$en-color-dark-green-10: $en-color-light-green-10;
-$en-color-dark-green-20: $en-color-light-green-20;
-$en-color-dark-green-30: $en-color-light-green-30;
-$en-color-dark-green-40: $en-color-light-green-40;
-$en-color-dark-green-50: $en-color-light-green-50;
-$en-color-dark-green-60: $en-color-light-green-60;
-$en-color-dark-green-70: $en-color-light-green-70;
-$en-color-dark-green-80: $en-color-light-green-80;
-$en-color-dark-green-90: $en-color-light-green-90;
+$en-color-green-10: #a9f3ba;
+$en-color-green-10-rgb: 169, 243, 186;
+$en-color-green-20: #73e693;
+$en-color-green-20-rgb: 115, 230, 147;
+$en-color-green-30: #00d061;
+$en-color-green-30-rgb: 0, 208, 97;
+$en-color-green-40: #00b755;
+$en-color-green-40-rgb: 0, 183, 85;
+$en-color-green-50: #009a46;
+$en-color-green-50-rgb: 0, 154, 70;
+$en-color-green-60: #007936;
+$en-color-green-60-rgb: 0, 121, 54;
+$en-color-green-70: #005a26;
+$en-color-green-70-rgb: 0, 90, 38;
+$en-color-green-80: #003d18;
+$en-color-green-80-rgb: 0, 61, 24;
+$en-color-green-90: #00210a;
+$en-color-green-90-rgb: 0, 33, 10;
 
-$en-color-light-yellow-10: #f0e498;
-$en-color-light-yellow-20: #dfd172;
-$en-color-light-yellow-30: #c7b700;
-$en-color-light-yellow-40: #afa100;
-$en-color-light-yellow-50: #938700;
-$en-color-light-yellow-60: #746a00;
-$en-color-light-yellow-70: #564e00;
-$en-color-light-yellow-80: #3a3500;
-$en-color-light-yellow-90: #1f1c00;
+$en-color-orange-10: #fff7e6;
+$en-color-orange-10-rgb: 255, 247, 230;
+$en-color-orange-20: #ffe7ba;
+$en-color-orange-20-rgb: 255, 231, 186;
+$en-color-orange-30: #ffd591;
+$en-color-orange-30-rgb: 255, 213, 145;
+$en-color-orange-40: #ffc069;
+$en-color-orange-40-rgb: 255, 192, 105;
+$en-color-orange-50: #fa8c16;
+$en-color-orange-50-rgb: 250, 140, 22;
+$en-color-orange-60: #fa8c16;
+$en-color-orange-60-rgb: 250, 140, 22;
+$en-color-orange-70: #ad4e00;
+$en-color-orange-70-rgb: 173, 78, 0;
+$en-color-orange-80: #873800;
+$en-color-orange-80-rgb: 135, 56, 0;
+$en-color-orange-90: #612500;
+$en-color-orange-90-rgb: 97, 37, 0;
 
-$en-color-dark-yellow-10: $en-color-light-yellow-10;
-$en-color-dark-yellow-20: $en-color-light-yellow-20;
-$en-color-dark-yellow-30: $en-color-light-yellow-30;
-$en-color-dark-yellow-40: $en-color-light-yellow-40;
-$en-color-dark-yellow-50: $en-color-light-yellow-50;
-$en-color-dark-yellow-60: $en-color-light-yellow-60;
-$en-color-dark-yellow-70: $en-color-light-yellow-70;
-$en-color-dark-yellow-80: $en-color-light-yellow-80;
-$en-color-dark-yellow-90: $en-color-light-yellow-90;
+$en-color-gold-10: #fff7e6;
+$en-color-gold-10-rgb: 255, 247, 230;
+$en-color-gold-20: #ffe7ba;
+$en-color-gold-20-rgb: 255, 231, 186;
+$en-color-gold-30: #ffd591;
+$en-color-gold-30-rgb: 255, 213, 145;
+$en-color-gold-40: #ffc069;
+$en-color-gold-40-rgb: 255, 192, 105;
+$en-color-gold-50: #fa8c16;
+$en-color-gold-50-rgb: 250, 140, 22;
+$en-color-gold-60: #fa8c16;
+$en-color-gold-60-rgb: 250, 140, 22;
+$en-color-gold-70: #ad4e00;
+$en-color-gold-70-rgb: 173, 78, 0;
+$en-color-gold-80: #873800;
+$en-color-gold-80-rgb: 135, 56, 0;
+$en-color-gold-90: #612500;
+$en-color-gold-90-rgb: 97, 37, 0;
 
-$en-color-light-red-10: #ffd9dc;
-$en-color-light-red-20: #ffc0c4;
-$en-color-light-red-30: #ff97a0;
-$en-color-light-red-40: #ff707f;
-$en-color-light-red-50: #ff2a51;
-$en-color-light-red-60: #d30038;
-$en-color-light-red-70: #9e0027;
-$en-color-light-red-80: #6f0019;
-$en-color-light-red-90: #40000a;
+$en-color-yellow-10: #f0e498;
+$en-color-yellow-10-rgb: 240, 228, 152;
+$en-color-yellow-20: #dfd172;
+$en-color-yellow-20-rgb: 223, 209, 114;
+$en-color-yellow-30: #c7b700;
+$en-color-yellow-30-rgb: 199, 183, 0;
+$en-color-yellow-40: #afa100;
+$en-color-yellow-40-rgb: 175, 161, 0;
+$en-color-yellow-50: #938700;
+$en-color-yellow-50-rgb: 147, 135, 0;
+$en-color-yellow-60: #746a00;
+$en-color-yellow-60-rgb: 116, 106, 0;
+$en-color-yellow-70: #564e00;
+$en-color-yellow-70-rgb: 86, 78, 0;
+$en-color-yellow-80: #3a3500;
+$en-color-yellow-80-rgb: 58, 53, 0;
+$en-color-yellow-90: #1f1c00;
+$en-color-yellow-90-rgb: 31, 28, 0;
 
-$en-color-dark-red-10: $en-color-light-red-10;
-$en-color-dark-red-20: $en-color-light-red-20;
-$en-color-dark-red-30: $en-color-light-red-30;
-$en-color-dark-red-40: $en-color-light-red-40;
-$en-color-dark-red-50: $en-color-light-red-50;
-$en-color-dark-red-60: $en-color-light-red-60;
-$en-color-dark-red-70: $en-color-light-red-70;
-$en-color-dark-red-80: $en-color-light-red-80;
-$en-color-dark-red-90: $en-color-light-red-90;
+$en-color-volcano-10: #fff2e8;
+$en-color-volcano-10-rgb: 255, 242, 232;
+$en-color-volcano-20: #ffd8bf;
+$en-color-volcano-20-rgb: 255, 216, 191;
+$en-color-volcano-30: #ffbb96;
+$en-color-volcano-30-rgb: 255, 187, 150;
+$en-color-volcano-40: #ff9c6e;
+$en-color-volcano-40-rgb: 255, 156, 110;
+$en-color-volcano-50: #fa541c;
+$en-color-volcano-50-rgb: 250, 84, 28;
+$en-color-volcano-60: #d4380d;
+$en-color-volcano-60-rgb: 212, 56, 13;
+$en-color-volcano-70: #ad2102;
+$en-color-volcano-70-rgb: 173, 33, 2;
+$en-color-volcano-80: #871400;
+$en-color-volcano-80-rgb: 135, 20, 0;
+$en-color-volcano-90: #610b00;
+$en-color-volcano-90-rgb: 97, 11, 0;
 
-$en-color-light-violet-10: #e6deff;
-$en-color-light-violet-20: #d4c5ff;
-$en-color-light-violet-30: #bea5ff;
-$en-color-light-violet-40: #ae8aff;
-$en-color-light-violet-50: #9b65ff;
-$en-color-light-violet-60: #872bff;
-$en-color-light-violet-70: #6800cf;
-$en-color-light-violet-80: #480091;
-$en-color-light-violet-90: #280056;
+$en-color-red-10: #ffd9dc;
+$en-color-red-10-rgb: 255, 217, 220;
+$en-color-red-20: #ffc0c4;
+$en-color-red-20-rgb: 255, 192, 196;
+$en-color-red-30: #ff97a0;
+$en-color-red-30-rgb: 255, 151, 160;
+$en-color-red-40: #ff707f;
+$en-color-red-40-rgb: 255, 112, 127;
+$en-color-red-50: #ff2a51;
+$en-color-red-50-rgb: 255, 42, 81;
+$en-color-red-60: #d30038;
+$en-color-red-60-rgb: 211, 0, 56;
+$en-color-red-70: #9e0027;
+$en-color-red-70-rgb: 158, 0, 39;
+$en-color-red-80: #6f0019;
+$en-color-red-80-rgb: 111, 0, 25;
+$en-color-red-90: #40000a;
+$en-color-red-90-rgb: 64, 0, 10;
 
-$en-color-dark-violet-10: $en-color-light-violet-10;
-$en-color-dark-violet-20: $en-color-light-violet-20;
-$en-color-dark-violet-30: $en-color-light-violet-30;
-$en-color-dark-violet-40: $en-color-light-violet-40;
-$en-color-dark-violet-50: $en-color-light-violet-50;
-$en-color-dark-violet-60: $en-color-light-violet-60;
-$en-color-dark-violet-70: $en-color-light-violet-70;
-$en-color-dark-violet-80: $en-color-light-violet-80;
-$en-color-dark-violet-90: $en-color-light-violet-90;
+$en-color-violet-10: #e6deff;
+$en-color-violet-10-rgb: 230, 222, 255;
+$en-color-violet-20: #d4c5ff;
+$en-color-violet-20-rgb: 212, 197, 255;
+$en-color-violet-30: #bea5ff;
+$en-color-violet-30-rgb: 190, 165, 255;
+$en-color-violet-40: #ae8aff;
+$en-color-violet-40-rgb: 174, 138, 255;
+$en-color-violet-50: #9b65ff;
+$en-color-violet-50-rgb: 155, 101, 255;
+$en-color-violet-60: #872bff;
+$en-color-violet-60-rgb: 135, 43, 255;
+$en-color-violet-70: #6800cf;
+$en-color-violet-70-rgb: 104, 0, 207;
+$en-color-violet-80: #480091;
+$en-color-violet-80-rgb: 72, 0, 145;
+$en-color-violet-90: #280056;
+$en-color-violet-90-rgb: 40, 0, 86;
 
-$en-color-light-pink-10: #ffd9df;
-$en-color-light-pink-20: #ffbbc8;
-$en-color-light-pink-30: #ff93aa;
-$en-color-light-pink-40: #ff6d91;
-$en-color-light-pink-50: #ff1f72;
-$en-color-light-pink-60: #d00058;
-$en-color-light-pink-70: #9e0041;
-$en-color-light-pink-80: #6d002b;
-$en-color-light-pink-90: #3f0015;
-
-$en-color-dark-pink-10: $en-color-light-pink-10;
-$en-color-dark-pink-20: $en-color-light-pink-20;
-$en-color-dark-pink-30: $en-color-light-pink-30;
-$en-color-dark-pink-40: $en-color-light-pink-40;
-$en-color-dark-pink-50: $en-color-light-pink-50;
-$en-color-dark-pink-60: $en-color-light-pink-60;
-$en-color-dark-pink-70: $en-color-light-pink-70;
-$en-color-dark-pink-80: $en-color-light-pink-80;
-$en-color-dark-pink-90: $en-color-light-pink-90;
-$en-light-text-primary: $en-color-neutral-90;
-$en-light-text-secondary: $en-color-neutral-70;
-$en-light-text-active: #{$en-color-neutral-50};
-$en-light-text-inactive: #{$en-color-neutral-40}a6;
-$en-light-text-link: $en-color-light-blue-60;
-$en-light-text-invert: $en-color-white;
-$en-light-text-muted: #6f6f6f;
-$en-light-background-primary: $en-color-white;
-$en-light-background-secondary: $en-color-neutral-light-70;
-$en-light-background-tertiary: #ebeaea;
-$en-light-background-toc-active: $en-color-neutral-light-90;
-$en-light-border-primary: $en-color-neutral-20;
-$en-light-border-secondary: $en-color-neutral-20;
-$en-light-border-success: $en-color-light-green-20;
-$en-light-button-primary-default: $en-color-neutral-90;
-$en-light-button-primary-hover: $en-color-neutral-60;
-$en-light-button-primary-active: $en-color-neutral-40;
-$en-light-button-primary-inactive: $en-color-neutral-90;
-$en-light-button-secondary-default: $en-color-white;
-$en-light-button-secondary-hover: $en-color-neutral-20;
-$en-light-button-secondary-active: $en-color-neutral-20;
-$en-light-button-secondary-inactive: $en-color-neutral-light-70;
-$en-light-button-secondary-border-focus: $en-color-light-blue-50;
-$en-light-button-secondary-border-red: $en-color-light-red-30;
-$en-light-button-secondary-border-red-focus: $en-color-light-red-10;
-$en-light-icon-primary: $en-color-neutral-60;
-$en-light-icon-secondary: $en-color-neutral-30;
-$en-light-icon-information: $en-color-light-blue-50;
-$en-light-icon-warning: $en-color-light-red-50;
-$en-light-icon-critical: $en-color-light-red-60;
-$en-light-icon-success: $en-color-light-green-60;
-$en-light-accent-primary: $en-color-light-blue-50;
-$en-light-accent-secondary: $en-color-light-blue-50;
-$en-light-field-focus-border: $en-color-light-blue-50;
-$en-light-focus-01: 0 0 0 3px rgba(0, 144, 237, 0.4);
-$en-light-shadow-01: 0 1px 2px rgba(43, 42, 51, 0.05);
-$en-light-shadow-02: 0 1px 6px rgba(43, 42, 51, 0.1);
-
-$en-light-code-token-tag: $en-color-light-blue-60;
-$en-light-code-token-punctuation: $en-color-neutral-50;
-$en-light-code-token-attribute-name: $en-color-light-red-60;
-$en-light-code-token-attribute-value: $en-color-light-green-60;
-$en-light-code-token-comment: $en-color-neutral-50;
-$en-light-code-token-default: $en-color-neutral-90;
-$en-light-code-token-selector: $en-color-light-violet-60;
-$en-light-code-background-inline: $en-color-neutral-light-80;
-$en-light-code-background-block: $en-color-neutral-light-80;
-
-$en-dark-text-primary: $en-color-white;
-$en-dark-text-secondary: $en-color-neutral-20;
-$en-dark-text-active: #{$en-color-neutral-50};
-$en-dark-text-inactive: #{$en-color-neutral-20}a6;
-$en-dark-text-link: $en-color-dark-blue-30;
-$en-dark-text-invert: $en-color-neutral-90;
-$en-dark-text-muted: #858585;
-$en-dark-background-primary: $en-color-neutral-90;
-$en-dark-background-secondary: $en-color-neutral-75;
-$en-dark-background-tertiary: #858585;
-$en-dark-background-toc-active: $en-color-neutral-80;
-$en-dark-border-primary: $en-color-neutral-50;
-$en-dark-border-secondary: $en-color-neutral-60;
-$en-dark-border-success: $en-color-dark-green-20;
-$en-dark-button-primary-default: $en-color-white;
-$en-dark-button-primary-hover: $en-color-neutral-20;
-$en-dark-button-primary-active: $en-color-neutral-40;
-$en-dark-button-primary-inactive: $en-color-white;
-$en-dark-button-secondary-default: $en-color-neutral-70;
-$en-dark-button-secondary-hover: $en-color-neutral-50;
-$en-dark-button-secondary-active: $en-color-neutral-40;
-$en-dark-button-secondary-inactive: $en-color-neutral-70;
-$en-dark-shadow-01: 0 1px 2px rgba(251, 251, 254, 0.2);
-$en-dark-shadow-02: 0 1px 6px rgba(251, 251, 254, 0.2);
-$en-dark-icon-primary: $en-color-white;
-$en-dark-icon-secondary: $en-color-neutral-30;
-$en-dark-icon-information: $en-color-dark-blue-40;
-$en-dark-icon-warning: $en-color-dark-yellow-40;
-$en-dark-icon-critical: $en-color-dark-red-40;
-$en-dark-icon-success: $en-color-dark-green-40;
-$en-dark-accent-primary: $en-color-dark-blue-40;
-$en-dark-accent-secondary: $en-color-dark-blue-40;
-$en-dark-field-focus-border: $en-color-white;
-$en-dark-focus-01: 0 0 0 3px rgba(251, 251, 254, 0.5);
-
-$en-dark-code-token-tag: $en-color-dark-blue-20;
-$en-dark-code-token-punctuation: $en-color-neutral-30;
-$en-dark-code-token-attribute-name: $en-color-dark-red-30;
-$en-dark-code-token-attribute-value: $en-color-dark-green-30;
-$en-dark-code-token-comment: $en-color-neutral-30;
-$en-dark-code-token-default: $en-color-white;
-$en-dark-code-token-selector: $en-color-dark-violet-30;
-$en-dark-code-background-inline: $en-color-neutral-80;
-$en-dark-code-background-block: $en-color-neutral-80;
-
-// screen is to small for sticky placement
-$screen-height-place-limit: 44rem;
+$en-color-pink-10: #ffd9df;
+$en-color-pink-10-rgb: 255, 217, 223;
+$en-color-pink-20: #ffbbc8;
+$en-color-pink-20-rgb: 255, 187, 200;
+$en-color-pink-30: #ff93aa;
+$en-color-pink-30-rgb: 255, 147, 170;
+$en-color-pink-40: #ff6d91;
+$en-color-pink-40-rgb: 255, 109, 145;
+$en-color-pink-50: #ff1f72;
+$en-color-pink-50-rgb: 255, 31, 114;
+$en-color-pink-60: #d00058;
+$en-color-pink-60-rgb: 208, 0, 88;
+$en-color-pink-70: #9e0041;
+$en-color-pink-70-rgb: 158, 0, 65;
+$en-color-pink-80: #6d002b;
+$en-color-pink-80-rgb: 109, 0, 43;
+$en-color-pink-90: #3f0015;
+$en-color-pink-90-rgb: 63, 0, 21;

package/styles/vars-size.scss

@@ -0,0 +1,6 @@
+// 空间尺寸
+$en-spacing-base: 8px;
+
+$en-font-size-base: 1rem;
+
+$en-transition-base: 0.1s;

package/type/components/ThemeContext/index.d.ts

@@ -0,0 +1,25 @@
+/**
+ * @license MIT
+ * enr@type/components/ThemeContext/index.d.ts 
+ * Copyright (c) 2025 earthnut.dev
+ * 请在项目根参看详细许可证明
+ */
+import { ThemeColorModeProviderProps, ThemeContextType } from './types';
+/**
+ * 使用主题颜色模式
+ *
+ * ```ts
+ * interface ThemeContextType {
+ *   autoColorMode: boolean;
+ *   colorMode: ColorMode;
+ *   colorModeClassName: string;
+ *   toggleColorMode: () => ColorMode;
+ *   setColorMode: (newColorMode: ColorMode) => ColorMode;
+ *   // 清理主题设置，让主题跟随系统
+ *   clearColorMode: () => void;
+ * }
+ * ```
+ */
+export declare function useColorMode(): ThemeContextType;
+/**    */
+export declare function ThemeColorModeProvider({ children, initialTheme }: ThemeColorModeProviderProps): import("react").JSX.Element;

package/{components → type/components}/ThemeContext/types.d.ts

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * earthnut@components/ThemeContext/types.d.ts 
+ * enr@type/components/ThemeContext/types.d.ts 
  * Copyright (c) 2025 earthnut.dev
  * 请在项目根参看详细许可证明
  */
@@ -12,6 +12,8 @@ export type ThemeContextType = {
     autoColorMode: boolean;
     /** 获取颜色模式  */
     colorMode: ColorMode;
+    /**  展示的当前颜色模型样式类 */
+    colorModeClassName: string;
     /**  切换颜色模式  */
     toggleColorMode: () => ColorMode;
     /**  设置颜色模式（仅允许设置为 'dark'、或 `light`） */
@@ -20,7 +22,7 @@ export type ThemeContextType = {
     clearColorMode: () => void;
 };
 export type ThemeColorModeProviderProps = {
-    children: React.ReactNode;
+    children?: React.ReactNode;
     /**  初始化默认的主题值  */
     initialTheme: ColorMode;
 };

package/{components → type/components}/button/button.d.ts

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * earthnut@components/button/button.d.ts 
+ * enr@type/components/button/button.d.ts 
  * Copyright (c) 2025 earthnut.dev
  * 请在项目根参看详细许可证明
  */

package/{components → type/components}/button/index.d.ts

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * earthnut@components/button/index.d.ts 
+ * enr@type/components/button/index.d.ts 
  * Copyright (c) 2025 earthnut.dev
  * 请在项目根参看详细许可证明
  */

package/{components → type/components}/image/index.d.ts

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * earthnut@components/image/index.d.ts 
+ * enr@type/components/image/index.d.ts 
  * Copyright (c) 2025 earthnut.dev
  * 请在项目根参看详细许可证明
  */

package/{components → type/components}/image/types.d.ts

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * earthnut@components/image/types.d.ts 
+ * enr@type/components/image/types.d.ts 
  * Copyright (c) 2025 earthnut.dev
  * 请在项目根参看详细许可证明
  */

package/{components → type/components}/image/useSrcChange.d.ts

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * earthnut@components/image/useSrcChange.d.ts 
+ * enr@type/components/image/useSrcChange.d.ts 
  * Copyright (c) 2025 earthnut.dev
  * 请在项目根参看详细许可证明
  */

package/{components → type/components}/layout/content.d.ts

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * earthnut@components/layout/content.d.ts 
+ * enr@type/components/layout/content.d.ts 
  * Copyright (c) 2025 earthnut.dev
  * 请在项目根参看详细许可证明
  */

package/{components → type/components}/layout/footer.d.ts

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * earthnut@components/layout/footer.d.ts 
+ * enr@type/components/layout/footer.d.ts 
  * Copyright (c) 2025 earthnut.dev
  * 请在项目根参看详细许可证明
  */

package/{components → type/components}/layout/get-value.d.ts

@@ -1,6 +1,6 @@
 /**
  * @license MIT
- * earthnut@components/layout/get-value.d.ts 
+ * enr@type/components/layout/get-value.d.ts 
  * Copyright (c) 2025 earthnut.dev
  * 请在项目根参看详细许可证明
  */