/* theme: dark */ [data-o-theme="dark"] { /** * @name * @type palette * @group white * @description */ --o-white: 255, 255, 255; /** * @name * @type palette * @group black * @description */ --o-black: 0, 0, 0; /** * @name * @type palette * @group kleinblue * @description */ --o-kleinblue-1: 11, 21, 55; /** * @name * @type palette * @group kleinblue * @description */ --o-kleinblue-2: 16, 30, 77; /** * @name * @type palette * @group kleinblue * @description */ --o-kleinblue-3: 27, 48, 113; /** * @name * @type palette * @group kleinblue * @description */ --o-kleinblue-4: 40, 68, 149; /** * @name * @type palette * @group kleinblue * @description */ --o-kleinblue-5: 55, 91, 184; /** * @name * @type palette * @group kleinblue * @description */ --o-kleinblue-6: 72, 116, 220; /** * @name * @type palette * @group kleinblue * @description */ --o-kleinblue-7: 105, 143, 227 ; /** * @name * @type palette * @group kleinblue * @description */ --o-kleinblue-8: 140, 171, 234; /** * @name * @type palette * @group kleinblue * @description */ --o-kleinblue-9: 176, 199, 241; /** * @name * @type palette * @group kleinblue * @description */ --o-kleinblue-10: 215, 227, 248; /** * @name * @type palette * @group yellow * @description */ --o-yellow-1: 81, 46, 9; /** * @name * @type palette * @group yellow * @description */ --o-yellow-2: 121, 75, 15; /** * @name * @type palette * @group yellow * @description */ --o-yellow-3: 161, 107, 22; /** * @name * @type palette * @group yellow * @description */ --o-yellow-4: 202, 143, 30; /** * @name * @type palette * @group yellow * @description */ --o-yellow-5: 242, 183, 38; /** * @name * @type palette * @group yellow * @description */ --o-yellow-6: 245, 202, 80; /** * @name * @type palette * @group yellow * @description */ --o-yellow-7: 247, 219, 122; /** * @name * @type palette * @group yellow * @description */ --o-yellow-8: 250, 234, 166; /** * @name * @type palette * @group yellow * @description */ --o-yellow-9: 252, 246, 210; /** * @name * @type palette * @group yellow * @description */ --o-yellow-10: 254, 251, 237; /** * @name * @type palette * @group orange * @description */ --o-orange-1: 77, 24, 0; /** * @name * @type palette * @group orange * @description */ --o-orange-2: 120, 42, 1; /** * @name * @type palette * @group orange * @description */ --o-orange-3: 163, 68, 8; /** * @name * @type palette * @group orange * @description */ --o-orange-4: 207, 97, 19; /** * @name * @type palette * @group orange * @description */ --o-orange-5: 250, 130, 33; /** * @name * @type palette * @group orange * @description */ --o-orange-6: 251, 143, 43; /** * @name * @type palette * @group orange * @description */ --o-orange-7: 252, 174, 91; /** * @name * @type palette * @group orange * @description */ --o-orange-8: 253, 202, 139; /** * @name * @type palette * @group orange * @description */ --o-orange-9: 254, 227, 188; /** * @name * @type palette * @group orange * @description */ --o-orange-10: 255, 248, 237; /** * @name * @type palette * @group red * @description */ --o-red-1: 77, 0, 17; /** * @name * @type palette * @group red * @description */ --o-red-2: 115, 3, 24; /** * @name * @type palette * @group red * @description */ --o-red-3: 153, 9, 31; /** * @name * @type palette * @group red * @description */ --o-red-4: 192, 17, 37; /** * @name * @type palette * @group red * @description */ --o-red-5: 230, 28, 43; /** * @name * @type palette * @group red * @description */ --o-red-6: 235, 35, 45; /** * @name * @type palette * @group red * @description */ --o-red-7: 240, 82, 85; /** * @name * @type palette * @group red * @description */ --o-red-8: 245, 132, 130; /** * @name * @type palette * @group red * @description */ --o-red-9: 250, 183, 180; /** * @name * @type palette * @group red * @description */ --o-red-10: 255, 234, 232; /** * @name * @type palette * @group green * @description */ --o-green-1: 0, 77, 42; /** * @name * @type palette * @group green * @description */ --o-green-2: 2, 102, 53; /** * @name * @type palette * @group green * @description */ --o-green-3: 10, 127, 66; /** * @name * @type palette * @group green * @description */ --o-green-4: 22, 152, 80; /** * @name * @type palette * @group green * @description */ --o-green-5: 36, 177, 95; /** * @name * @type palette * @group green * @description */ --o-green-6: 51, 193, 104; /** * @name * @type palette * @group green * @description */ --o-green-7: 90, 208, 131; /** * @name * @type palette * @group green * @description */ --o-green-8: 135, 224, 163; /** * @name * @type palette * @group green * @description */ --o-green-9: 185, 239, 200; /** * @name * @type palette * @group green * @description */ --o-green-10: 240, 255, 244; /** * @name * @type palette * @group amber * @description */ --o-amber-1: 77, 30, 0; /** * @name * @type palette * @group amber * @description */ --o-amber-2: 116, 51, 0; /** * @name * @type palette * @group amber * @description */ --o-amber-3: 154, 76, 0; /** * @name * @type palette * @group amber * @description */ --o-amber-4: 193, 105, 0; /** * @name * @type palette * @group amber * @description */ --o-amber-5: 231, 137, 0; /** * @name * @type palette * @group amber * @description */ --o-amber-6: 236, 165, 47; /** * @name * @type palette * @group amber * @description */ --o-amber-7: 241, 191, 96; /** * @name * @type palette * @group amber * @description */ --o-amber-8: 245, 215, 147; /** * @name * @type palette * @group amber * @description */ --o-amber-9: 250, 237, 200; /** * @name * @type palette * @group amber * @description */ --o-amber-10: 253, 247, 232; /** * @name * @type palette * @group lime * @description */ --o-lime-1: 53, 70, 0; /** * @name * @type palette * @group lime * @description */ --o-lime-2: 82, 105, 0; /** * @name * @type palette * @group lime * @description */ --o-lime-3: 112, 141, 1; /** * @name * @type palette * @group lime * @description */ --o-lime-4: 143, 176, 2; /** * @name * @type palette * @group lime * @description */ --o-lime-5: 175, 211, 5; /** * @name * @type palette * @group lime * @description */ --o-lime-6: 184, 220, 48; /** * @name * @type palette * @group lime * @description */ --o-lime-7: 196, 229, 95; /** * @name * @type palette * @group lime * @description */ --o-lime-8: 212, 237, 145; /** * @name * @type palette * @group lime * @description */ --o-lime-9: 231, 246, 198; /** * @name * @type palette * @group lime * @description */ --o-lime-10: 244, 251, 231; /** * @name * @type palette * @group light-green * @description */ --o-light-green-1: 33, 60, 7; /** * @name * @type palette * @group light-green * @description */ --o-light-green-2: 51, 90, 11; /** * @name * @type palette * @group light-green * @description */ --o-light-green-3: 70, 119, 16; /** * @name * @type palette * @group light-green * @description */ --o-light-green-4: 91, 149, 21; /** * @name * @type palette * @group light-green * @description */ --o-light-green-5: 112, 179, 27; /** * @name * @type palette * @group light-green * @description */ --o-light-green-6: 184, 220, 48; /** * @name * @type palette * @group light-green * @description */ --o-light-green-7: 166, 209, 103; /** * @name * @type palette * @group light-green * @description */ --o-light-green-8: 195, 225, 148; /** * @name * @type palette * @group light-green * @description */ --o-light-green-9: 225, 240, 199; /** * @name * @type palette * @group light-green * @description */ --o-light-green-10: 242, 247, 231; /** * @name * @type palette * @group teal * @description */ --o-teal-1: 0, 60, 48; /** * @name * @type palette * @group teal * @description */ --o-teal-2: 0, 90, 71; /** * @name * @type palette * @group teal * @description */ --o-teal-3: 0, 119, 93; /** * @name * @type palette * @group teal * @description */ --o-teal-4: 0, 149, 113; /** * @name * @type palette * @group teal * @description */ --o-teal-5: 0, 179, 133; /** * @name * @type palette * @group teal * @description */ --o-teal-6: 39, 194, 152; /** * @name * @type palette * @group teal * @description */ --o-teal-7: 84, 209, 173; /** * @name * @type palette * @group teal * @description */ --o-teal-8: 135, 225, 197; /** * @name * @type palette * @group teal * @description */ --o-teal-9: 192, 240, 224; /** * @name * @type palette * @group teal * @description */ --o-teal-10: 228, 247, 241; /** * @name * @type palette * @group cyan * @description */ --o-cyan-1: 0, 52, 60; /** * @name * @type palette * @group cyan * @description */ --o-cyan-2: 0, 79, 90; /** * @name * @type palette * @group cyan * @description */ --o-cyan-3: 0, 107, 119; /** * @name * @type palette * @group cyan * @description */ --o-cyan-4: 0, 137, 149; /** * @name * @type palette * @group cyan * @description */ --o-cyan-5: 39, 186, 194; /** * @name * @type palette * @group cyan * @description */ --o-cyan-6: 84, 205, 209; /** * @name * @type palette * @group cyan * @description */ --o-cyan-7: 92, 208, 212; /** * @name * @type palette * @group cyan * @description */ --o-cyan-8: 135, 223, 225; /** * @name * @type palette * @group cyan * @description */ --o-cyan-9: 192, 240, 240; /** * @name * @type palette * @group cyan * @description */ --o-cyan-10: 228, 247, 247; /** * @name * @type palette * @group light-blue * @description */ --o-light-blue-1: 0, 47, 76; /** * @name * @type palette * @group light-blue * @description */ --o-light-blue-2: 0, 72, 115; /** * @name * @type palette * @group light-blue * @description */ --o-light-blue-3: 0, 99, 153; /** * @name * @type palette * @group light-blue * @description */ --o-light-blue-4: 0, 127, 191; /** * @name * @type palette * @group light-blue * @description */ --o-light-blue-5: 0, 156, 229; /** * @name * @type palette * @group light-blue * @description */ --o-light-blue-6: 47, 178, 234; /** * @name * @type palette * @group light-blue * @description */ --o-light-blue-7: 96, 198, 239; /** * @name * @type palette * @group light-blue * @description */ --o-light-blue-8: 147, 218, 245; /** * @name * @type palette * @group light-blue * @description */ --o-light-blue-9: 200, 237, 250; /** * @name * @type palette * @group light-blue * @description */ --o-light-blue-10: 232, 247, 252; /** * @name * @type palette * @group blue * @description */ --o-blue-1: 0, 43, 97; /** * @name * @type palette * @group blue * @description */ --o-blue-2: 0, 61, 133; /** * @name * @type palette * @group blue * @description */ --o-blue-3: 0, 80, 169; /** * @name * @type palette * @group blue * @description */ --o-blue-4: 0, 100, 204; /** * @name * @type palette * @group blue * @description */ --o-blue-5: 0, 122, 240; /** * @name * @type palette * @group blue * @description */ --o-blue-6: 49, 151, 243; /** * @name * @type palette * @group blue * @description */ --o-blue-7: 98, 178, 246; /** * @name * @type palette * @group blue * @description */ --o-blue-8: 149, 205, 249; /** * @name * @type palette * @group blue * @description */ --o-blue-9: 202, 231, 252; /** * @name * @type palette * @group blue * @description */ --o-blue-10: 233, 245, 254; /** * @name * @type palette * @group mixedgray * @description */ --o-mixedgray-1: 0, 0, 0; /** * @name * @type palette * @group mixedgray * @description */ --o-mixedgray-2: 18, 18, 20; /** * @name * @type palette * @group mixedgray * @description */ --o-mixedgray-3: 28, 26, 28; /** * @name * @type palette * @group mixedgray * @description */ --o-mixedgray-4: 36, 36, 39; /** * @name * @type palette * @group mixedgray * @description */ --o-mixedgray-5: 43, 43, 47; /** * @name * @type palette * @group mixedgray * @description */ --o-mixedgray-6: 53, 53, 57; /** * @name * @type palette * @group mixedgray * @description */ --o-mixedgray-7: 63, 63, 67; /** * @name * @type palette * @group mixedgray * @description */ --o-mixedgray-8: 85, 85, 88; /** * @name * @type palette * @group mixedgray * @description */ --o-mixedgray-9: 118, 118, 122; /** * @name * @type palette * @group mixedgray * @description */ --o-mixedgray-10: 156, 156, 159; /** * @name * @type palette * @group mixedgray * @description */ --o-mixedgray-11: 181, 181, 185; /** * @name * @type palette * @group mixedgray * @description */ --o-mixedgray-12: 208, 208, 210; /** * @name * @type palette * @group mixedgray * @description */ --o-mixedgray-13: 235, 235, 238; /** * @name * @type palette * @group mixedgray * @description */ --o-mixedgray-14: 255,255, 255; /** * @name * @type palette * @group indigo * @description */ --o-indigo-1: 5, 19, 101; /** * @name * @type palette * @group indigo * @description */ --o-indigo-2: 10, 28, 118; /** * @name * @type palette * @group indigo * @description */ --o-indigo-3: 16, 38, 138; /** * @name * @type palette * @group indigo * @description */ --o-indigo-4: 23, 50, 159; /** * @name * @type palette * @group indigo * @description */ --o-indigo-5: 31, 63, 179; /** * @name * @type palette * @group indigo * @description */ --o-indigo-6: 66, 96, 194; /** * @name * @type palette * @group indigo * @description */ --o-indigo-7: 106, 131, 209; /** * @name * @type palette * @group indigo * @description */ --o-indigo-8: 150, 170, 225; /** * @name * @type palette * @group indigo * @description */ --o-indigo-9: 209, 218, 241; /** * @name * @type palette * @group indigo * @description */ --o-indigo-10: 232, 236, 247; /** * @name * @type palette * @group violet * @description */ --o-violet-1: 34, 0, 109; /** * @name * @type palette * @group violet * @description */ --o-violet-2: 39, 2, 130; /** * @name * @type palette * @group violet * @description */ --o-violet-3: 46, 7, 150; /** * @name * @type palette * @group violet * @description */ --o-violet-4: 53, 13, 171; /** * @name * @type palette * @group violet * @description */ --o-violet-5: 61, 20, 191; /** * @name * @type palette * @group violet * @description */ --o-violet-6: 97, 62, 201; /** * @name * @type palette * @group violet * @description */ --o-violet-7: 150, 130, 223; /** * @name * @type palette * @group violet * @description */ --o-violet-8: 182, 169, 233; /** * @name * @type palette * @group violet * @description */ --o-violet-9: 217, 210, 244; /** * @name * @type palette * @group violet * @description */ --o-violet-10: 240, 237, 250; /** * @name * @type palette * @group purple * @description */ --o-purple-1: 60, 0, 97; /** * @name * @type palette * @group purple * @description */ --o-purple-2: 77, 0, 118; /** * @name * @type palette * @group purple * @description */ --o-purple-3: 95, 0, 138; /** * @name * @type palette * @group purple * @description */ --o-purple-4: 114, 0, 159; /** * @name * @type palette * @group purple * @description */ --o-purple-5: 135, 2, 179; /** * @name * @type palette * @group purple * @description */ --o-purple-6: 161, 41, 194; /** * @name * @type palette * @group purple * @description */ --o-purple-7: 187, 85, 209; /** * @name * @type palette * @group purple * @description */ --o-purple-8: 211, 136, 225; /** * @name * @type palette * @group purple * @description */ --o-purple-9: 234, 192, 240; /** * @name * @type palette * @group purple * @description */ --o-purple-10: 245, 228, 247; /** * @name * @type palette * @group pink * @description */ --o-pink-1: 81, 0, 51; /** * @name * @type palette * @group pink * @description */ --o-pink-2: 117, 0, 70; /** * @name * @type palette * @group pink * @description */ --o-pink-3: 153, 0, 86; /** * @name * @type palette * @group pink * @description */ --o-pink-4: 188, 0, 100; /** * @name * @type palette * @group pink * @description */ --o-pink-5: 224, 0, 112; /** * @name * @type palette * @group pink * @description */ --o-pink-6: 230, 46, 132; /** * @name * @type palette * @group pink * @description */ --o-pink-7: 236, 95, 156; /** * @name * @type palette * @group pink * @description */ --o-pink-8: 243, 146, 184; /** * @name * @type palette * @group pink * @description */ --o-pink-9: 249, 199, 217; /** * @name * @type palette * @group pink * @description */ --o-pink-10: 252, 232, 239; /** * @name * @type color * @group base * @description */ --o-color-white: rgb(var(--o-white)); /** * @name * @type color * @group base * @description */ --o-color-black: rgb(var(--o-black)); /** * @name * @type color * @group primary * @description 常规 */ --o-color-primary1: rgb(var(--o-kleinblue-5)); /** * @name * @type color * @group primary * @description 悬浮 */ --o-color-primary2: rgb(var(--o-kleinblue-4)); /** * @name * @type color * @group primary * @description 激活 */ --o-color-primary3: rgb(var(--o-kleinblue-7)); /** * @name * @type color * @group primary * @description 禁用 */ --o-color-primary4: rgb(var(--o-kleinblue-3)); /** * @name * @type color * @group primary * @description 常规-浅 */ --o-color-primary1-light: rgb(var(--o-kleinblue-2)); /** * @name * @type color * @group primary * @description 悬浮-浅 */ --o-color-primary2-light: rgb(var(--o-kleinblue-3)); /** * @name * @type color * @group primary * @description 激活-浅 */ --o-color-primary3-light: rgb(var(--o-kleinblue-4)); /** * @name * @type color * @group primary * @description 禁用-浅 */ --o-color-primary4-light: rgb(var(--o-kleinblue-1)); /** * @name * @type color * @group success * @description 常规 */ --o-color-success1: rgb(var(--o-green-6)); /** * @name * @type color * @group success * @description 悬浮 */ --o-color-success2: rgb(var(--o-green-4)); /** * @name * @type color * @group success * @description 激活 */ --o-color-success3: rgb(var(--o-green-7)); /** * @name * @type color * @group success * @description 禁用 */ --o-color-success4: rgb(var(--o-green-3)); /** * @name * @type color * @group success * @description 常规-浅 */ --o-color-success1-light: rgb(var(--o-green-2)); /** * @name * @type color * @group success * @description 悬浮-浅 */ --o-color-success2-light: rgb(var(--o-green-3)); /** * @name * @type color * @group success * @description 激活-浅 */ --o-color-success3-light: rgb(var(--o-green-4)); /** * @name * @type color * @group success * @description 禁用-浅 */ --o-color-success4-light: rgb(var(--o-green-1)); /** * @name * @type color * @group warning * @description 常规 */ --o-color-warning1: rgb(var(--o-orange-6)); /** * @name * @type color * @group warning * @description 悬浮 */ --o-color-warning2: rgb(var(--o-orange-4)); /** * @name * @type color * @group warning * @description 激活 */ --o-color-warning3: rgb(var(--o-orange-7)); /** * @name * @type color * @group warning * @description 禁用 */ --o-color-warning4: rgb(var(--o-orange-3)); /** * @name * @type color * @group warning * @description 常规-浅 */ --o-color-warning1-light: rgb(var(--o-orange-2)); /** * @name * @type color * @group warning * @description 悬浮-浅 */ --o-color-warning2-light: rgb(var(--o-orange-3)); /** * @name * @type color * @group warning * @description 激活-浅 */ --o-color-warning3-light: rgb(var(--o-orange-4)); /** * @name * @type color * @group warning * @description 禁用-浅 */ --o-color-warning4-light: rgb(var(--o-orange-1)); /** * @name * @type color * @group danger * @description 常规 */ --o-color-danger1: rgb(var(--o-red-6)); /** * @name * @type color * @group danger * @description 悬浮 */ --o-color-danger2: rgb(var(--o-red-4)); /** * @name * @type color * @group danger * @description 激活 */ --o-color-danger3: rgb(var(--o-red-7)); /** * @name * @type color * @group danger * @description 禁用 */ --o-color-danger4: rgb(var(--o-red-3)); /** * @name * @type color * @group danger * @description 常规-浅 */ --o-color-danger1-light: rgb(var(--o-red-2)); /** * @name * @type color * @group danger * @description 悬浮-浅 */ --o-color-danger2-light: rgb(var(--o-red-3)); /** * @name * @type color * @group danger * @description 激活-浅 */ --o-color-danger3-light: rgb(var(--o-red-4)); /** * @name * @type color * @group danger * @description 禁用-浅 */ --o-color-danger4-light: rgb(var(--o-red-1)); /** * @name * @type color * @group fill * @description 一级填充：页面背景 */ --o-color-fill1: rgb(var(--o-mixedgray-3)); /** * @name * @type color * @group fill * @description 二级填充：区块/卡片 */ --o-color-fill2: rgb(var(--o-mixedgray-4)); /** * @name * @type color * @group fill * @description 三级填充：卡片 */ --o-color-fill3: rgb(var(--o-mixedgray-5)); /** * @name * @type color * @group control * @description 常规，常用于边框 */ --o-color-control1: rgba(var(--o-mixedgray-10), 0.25); /** * @name * @type color * @group control * @description 悬浮，常用于边框 */ --o-color-control2: rgba(var(--o-mixedgray-10), 0.6); /** * @name * @type color * @group control * @description 激活，常用于边框 */ --o-color-control3: rgba(var(--o-mixedgray-10), 0.8); /** * @name * @type color * @group control * @description 禁用，常用于边框 */ --o-color-control4: rgba(var(--o-mixedgray-10), 0.15); /** * @name * @type color * @group control * @description 常规-浅，常用于背景 */ --o-color-control1-light: rgb(var(--o-mixedgray-7), 1.0); /** * @name * @type color * @group control * @description 悬浮-浅，常用于背景 */ --o-color-control2-light: rgb(var(--o-mixedgray-5), 1); /** * @name * @type color * @group control * @description 激活-浅，常用于背景 */ --o-color-control3-light: rgb(var(--o-mixedgray-6), 1); /** * @name * @type color * @group control * @description 禁用-浅，常用于背景 */ --o-color-control4-light: rgb(var(--o-mixedgray-5), 1); /** * @name * @type color * @group control * @description 很浅，常用于表格背景色 */ --o-color-control-light: rgb(var(--o-mixedgray-4), 1.0); /** * @name * @type color * @group info * @description 一级/强调/标题 */ --o-color-info1: rgba(var(--o-mixedgray-14), 1.0); /** * @name * @type color * @group info * @description 二级/次强调/正文 */ --o-color-info2: rgba(var(--o-mixedgray-14), 0.8); /** * @name * @type color * @group info * @description 三级/辅助信息 */ --o-color-info3: rgba(var(--o-mixedgray-14), 0.6); /** * @name * @type color * @group info * @description 置灰/禁用 */ --o-color-info4: rgba(var(--o-mixedgray-14), 0.4); /** * @name * @type color * @group info * @description 一级/次强调/正文反色 */ --o-color-info1-inverse: rgba(var(--o-mixedgray-1), 1.0); /** * @name * @type color * @group info * @description 二级/辅助信息反色 */ --o-color-info2-inverse: rgba(var(--o-mixedgray-1), 0.8); /** * @name * @type color * @group info * @description 三级/辅助信息反色 */ --o-color-info3-inverse: rgba(var(--o-mixedgray-1), 0.6); /** * @name * @type color * @group info * @description 置灰/禁用反色 */ --o-color-info4-inverse: rgba(var(--o-mixedgray-1), 0.4); /** * @name * @type color * @group mask * @description 全局遮罩 */ --o-color-mask1: rgba(var(--o-mixedgray-14), 0.4); /** * @name * @type color * @group mask * @description 局部遮罩 */ --o-color-mask2: rgba(var(--o-mixedgray-4), 0.2); /** * @name * @type color * @group link * @description 常规 */ --o-color-link1: rgba(var(--o-kleinblue-5)); /** * @name * @type color * @group link * @description 悬浮 */ --o-color-link2: rgba(var(--o-kleinblue-4)); /** * @name * @type color * @group link * @description 激活 */ --o-color-link3: rgba(var(--o-kleinblue-7)); /** * @name * @type color * @group link * @description 禁用 */ --o-color-link4: rgba(var(--o-kleinblue-3)); /** * @name 阴影1 * @type shadow * @group shadow * @description 用于卡片、小弹窗、楼层阴影 */ --o-shadow-1: 0 3px 8px rgba(var(--o-mixedgray-1), 0.08); /** * @name 阴影2 * @type shadow * @group shadow * @description 用于卡片悬浮阴影 */ --o-shadow-2: 0 2px 24px rgba(var(--o-mixedgray-1), 0.15); /** * @name 阴影3 * @type shadow * @group shadow * @description 用于提示阴影 */ --o-shadow-3: 0 8px 40px rgba(var(--o-mixedgray-1), 0.1); /** * @name 间距1 * @type gap * @group gap * @description 用于组件之间的间距1 */ --o-gap-1: 4px; /** * @name 间距2 * @type gap * @group gap * @description 用于组件之间的间距2 */ --o-gap-2: 8px; /** * @name 间距3 * @type gap * @group gap * @description 用于组件之间的间距3 */ --o-gap-3: 12px; /** * @name 间距4 * @type gap * @group gap * @description 用于组件之间的间距4 */ --o-gap-4: 16px; /** * @name 间距5 * @type gap * @group gap * @description 用于组件之间的间距5 */ --o-gap-5: 24px; /** * @name 间距6 * @type gap * @group gap * @description 用于组件之间的间距6 */ --o-gap-6: 32px; /** * @name 间距7 * @type gap * @group gap * @description 用于组件之间的间距7 */ --o-gap-7: 40px; /** * @name 间距8 * @type gap * @group gap * @description 用于组件之间的间距8 */ --o-gap-8: 48px; /** * @name 间距9 * @type gap * @group gap * @description 用于组件之间的间距9 */ --o-gap-9: 64px; /** * @name 间距10 * @type gap * @group gap * @description 用于组件之间的间距10 */ --o-gap-10: 72px; /** * @name 超小尺寸 * @type size * @group control_size * @description 超小尺寸 */ --o-control_size-2xs: 14px; /** * @name 小尺寸 * @type size * @group control_size * @description 小尺寸 */ --o-control_size-xs: 16px; /** * @name 小尺寸 * @type size * @group control_size * @description 小尺寸 */ --o-control_size-s: 24px; /** * @name 中尺寸 * @type size * @group control_size * @description 尺寸 */ --o-control_size-m: 32px; /** * @name 大尺寸 * @type size * @group control_size * @description 尺寸 */ --o-control_size-l: 40px; /** * @name 大尺寸 * @type size * @group control_size * @description 尺寸 */ --o-control_size-xl: 48px; /** * @name 大尺寸 * @type size * @group control_size * @description 尺寸 */ --o-control_size-2xl: 56px; /** * @name 超小尺寸图标 * @type size * @group icon_size * @description 超小尺寸图标 */ --o-icon_size-xs: 16px; /** * @name 小尺寸图标 * @type size * @group icon_size * @description 小尺寸图标 */ --o-icon_size-s: 20px; /** * @name 中尺寸图标 * @type size * @group icon_size * @description 中尺寸图标 */ --o-icon_size-m: 24px; /** * @name 大尺寸图标 * @type size * @group icon_size * @description 大尺寸图标 */ --o-icon_size-l: 32px; /** * @name 超大尺寸图标 * @type size * @group icon_size * @description 超大尺寸图标 */ --o-icon_size-xl: 40px; /** * @name 2xl尺寸图标 * @type size * @group icon_size * @description 2xl尺寸图标 */ --o-icon_size-2xl: 48px; /** * @name 3xl尺寸图标 * @type size * @group icon_size * @description 3xl尺寸图标 */ --o-icon_size-3xl: 56px; /** * @name 4xl尺寸图标 * @type size * @group icon_size * @description 4xl尺寸图标 */ --o-icon_size-4xl: 64px; /** * @name 超小尺寸图标 * @type size * @group icon_size_control * @description 超小尺寸控件图标(组件使用) */ --o-icon_size_control-xs: 16px; /** * @name 小尺寸图标 * @type size * @group icon_size_control * @description 小尺寸控件图标(组件使用) */ --o-icon_size_control-s: 20px; /** * @name 中尺寸图标 * @type size * @group icon_size_control * @description 中尺寸控件图标(组件使用) */ --o-icon_size_control-m: 24px; /** * @name 大尺寸图标 * @type size * @group icon_size_control * @description 大尺寸控件图标(组件使用) */ --o-icon_size_control-l: 32px; /** * @name 超大尺寸图标 * @type size * @group icon_size_control * @description 超大尺寸控件图标(组件使用) */ --o-icon_size_control-xl: 40px; /** * @name 一级数据展示 * @type font * @group font_size * @description 一级数据展示 */ --o-font_size-display1: 56px; /** * @name 二级数据展示 * @type font * @group font_size * @description 二级数据展示 */ --o-font_size-display2: 48px; /** * @name 三级数据展示 * @type font * @group font_size * @description 三级数据展示 */ --o-font_size-display3: 40px; /** * @name 一级标题 * @type font * @group font_size * @description 一级标题 */ --o-font_size-h1: 32px; /** * @name 二级标题 * @type font * @group font_size * @description 二级标题 */ --o-font_size-h2: 24px; /** * @name 三级标题 * @type font * @group font_size * @description 三级标题 */ --o-font_size-h3: 22px; /** * @name 四级标题 * @type font * @group font_size * @description 四级标题 */ --o-font_size-h4: 20px; /** * @name 常规正文 * @type font * @group font_size * @description 常规正文 */ --o-font_size-text1: 16px; /** * @name 大号正文 * @type font * @group font_size * @description 大号正文 */ --o-font_size-text2: 18px; /** * @name 提示文本1 * @type font * @group font_size * @description 提示文本1 */ --o-font_size-tip1: 14px; /** * @name 提示文本2 * @type font * @group font_size * @description 提示文本2 */ --o-font_size-tip2: 12px; /** * @name 一级数据展示 * @type font * @group line_height * @description 一级数据展示 */ --o-line_height-display1: 80px; /** * @name 二级数据展示 * @type font * @group line_height * @description 二级数据展示 */ --o-line_height-display2: 64px; /** * @name 三级数据展示 * @type font * @group line_height * @description 三级数据展示 */ --o-line_height-display3: 56px; /** * @name 一级标题 * @type font * @group line_height * @description 一级标题 */ --o-line_height-h1: 44px; /** * @name 二级标题 * @type font * @group line_height * @description 二级标题 */ --o-line_height-h2: 32px; /** * @name 三级标题 * @type font * @group line_height * @description 三级标题 */ --o-line_height-h3: 30px; /** * @name 四级标题 * @type font * @group line_height * @description 四级标题 */ --o-line_height-h4: 28px; /** * @name 正文 * @type font * @group line_height * @description 正文 */ --o-line_height-text1: 24px; /** * @name 正文-大 * @type font * @group line_height * @description 正文-大 */ --o-line_height-text2: 26x; /** * @name 提示文本1 * @type font * @group line_height * @description 提示文本1 */ --o-line_height-tip1: 22px; /** * @name 提示文本2 * @type font * @group line_height * @description 提示文本2 */ --o-line_height-tip2: 18px; /** * @name 超小尺寸圆角 * @type size * @group radius * @description 超小尺寸圆角 */ --o-radius-xs: 4px; /** * @name 小尺寸圆角 * @type size * @group radius * @description 小尺寸圆角 */ --o-radius-s: 8px; /** * @name 中尺寸圆角 * @type size * @group radius * @description 中尺寸圆角 */ --o-radius-m: 12px; /** * @name 大尺寸圆角 * @type size * @group radius * @description 大尺寸圆角 */ --o-radius-l: 16px; /** * @name 大尺寸圆角 * @type size * @group radius * @description 大尺寸圆角,一般用于卡片 */ --o-radius-xl: 24px; /** * @name 超小尺寸控件圆角 * @type size * @group radius_control * @description 超小尺寸控件圆角(组件使用) */ --o-radius_control-xs: 4px; /** * @name 小尺寸控件圆角 * @type size * @group radius_control * @description 小尺寸控件圆角(组件使用) */ --o-radius_control-s: 8px; /** * @name 中尺寸控件圆角 * @type size * @group radius_control * @description 中尺寸控件圆角(组件使用) */ --o-radius_control-m: 12px; /** * @name 大尺寸控件圆角 * @type size * @group radius_control * @description 大尺寸控件圆角(组件使用) */ --o-radius_control-l: 16px; /** * @name 持续时间 * @type animation * @group duration * @description 用于退出屏幕的动画 */ --o-duration-s: 200ms; /** * @name 持续时间 * @type animation * @group duration * @description 用于当曲线为standard-in时进入屏幕的动画 */ --o-duration-m1: 250ms; /** * @name 持续时间 * @type animation * @group duration * @description 用于当曲线为standard时开始、结束的动画 */ --o-duration-m2: 300ms; /** * @name 持续时间 * @type animation * @group duration * @description 用于当曲线为emphasized-in时进入屏幕的动画 */ --o-duration-m3: 400ms; /** * @name 持续时间 * @type animation * @group duration * @description 用于当曲线为emphasized时开始、结束的动画 */ --o-duration-l: 500ms; /** * @name 持续时间 * @type animation * @group duration * @description 用于当曲线为emphasized时，轮播切换动画 */ --o-duration-xl: 1000ms; /** * @name 线性动画曲线 * @type animation * @group easing * @description 线性曲线 */ --o-easing-linear: cubic-bezier(0, 0, 1, 1); /** * @name 动画曲线 * @type animation * @group easing * @description 用于组件 */ --o-easing-standard: cubic-bezier(0.2, 0, 0, 1); /** * @name 动画曲线 * @type animation * @group easing * @description 用于组件 */ --o-easing-standard-in: cubic-bezier(0, 0, 0, 1); /** * @name 动画曲线 * @type animation * @group easing * @description 用于组件 */ --o-easing-standard-out: cubic-bezier(0.3, 0, 1, 1); /** * @name 动画曲线 * @type animation * @group easing * @description 用于大卡片、场景切换 */ --o-easing-emphasized: cubic-bezier(0.2, 0, 0, 1); /** * @name 动画曲线 * @type animation * @group easing * @description 用于大卡片、场景切换 */ --o-easing-emphasized-in: cubic-bezier(0.3, 0, 0.8, 0.15); /** * @name 动画曲线 * @type animation * @group easing * @description 用于大卡片、场景切换 */ --o-easing-emphasized-out: cubic-bezier(0.05, 0.7, 0.1, 1); }