tntd/themes/default/lessToCssVar.less

tntd是基于 TNT Design 设计体系的 React UI 组件库，主要用于研发企业级中后台产品。

// -------- less变量 ==> css变量 -----------
@primary-color: var(--blue-6);
@info-color: var(--blue-6);
@success-color: var(--green-6);
@processing-color: var(--blue-6);
@error-color: var(--red-6);
@highlight-color: var(--red-6);
@warning-color: var(--gold-6);
@blue-1: var(--blue-1);
@blue-2: var(--blue-2);
@blue-3: var(--blue-3);
@blue-4: var(--blue-4);
@blue-5: var(--blue-5);
@blue-7: var(--blue-7);
@blue-8: var(--blue-8);
@blue-9: var(--blue-9);
@blue-10: var(--blue-10);
@purple-1: var(--purple-1);
@purple-2: var(--purple-2);
@purple-3: var(--purple-3);
@purple-4: var(--purple-4);
@purple-5: var(--purple-5);
@purple-7: var(--purple-7);
@purple-8: var(--purple-8);
@purple-9: var(--purple-9);
@purple-10: var(--purple-10);
@cyan-1: var(--cyan-1);
@cyan-2: var(--cyan-2);
@cyan-3: var(--cyan-3);
@cyan-4: var(--cyan-4);
@cyan-5: var(--cyan-5);
@cyan-7: var(--cyan-7);
@cyan-8: var(--cyan-8);
@cyan-9: var(--cyan-9);
@cyan-10: var(--cyan-10);
@green-1: var(--green-1);
@green-2: var(--green-2);
@green-3: var(--green-3);
@green-4: var(--green-4);
@green-5: var(--green-5);
@green-7: var(--green-7);
@green-8: var(--green-8);
@green-9: var(--green-9);
@green-10: var(--green-10);
@magenta-1: var(--magenta-1);
@magenta-2: var(--magenta-2);
@magenta-3: var(--magenta-3);
@magenta-4: var(--magenta-4);
@magenta-5: var(--magenta-5);
@magenta-7: var(--magenta-7);
@magenta-8: var(--magenta-8);
@magenta-9: var(--magenta-9);
@magenta-10: var(--magenta-10);
@pink-1: var(--pink-1);
@pink-2: var(--pink-2);
@pink-3: var(--pink-3);
@pink-4: var(--pink-4);
@pink-5: var(--pink-5);
@pink-7: var(--pink-7);
@pink-8: var(--pink-8);
@pink-9: var(--pink-9);
@pink-10: var(--pink-10);
@red-1: var(--red-1);
@red-2: var(--red-2);
@red-3: var(--red-3);
@red-4: var(--red-4);
@red-5: var(--red-5);
@red-7: var(--red-7);
@red-8: var(--red-8);
@red-9: var(--red-9);
@red-10: var(--red-10);
@orange-1: var(--orange-1);
@orange-2: var(--orange-2);
@orange-3: var(--orange-3);
@orange-4: var(--orange-4);
@orange-5: var(--orange-5);
@orange-7: var(--orange-7);
@orange-8: var(--orange-8);
@orange-9: var(--orange-9);
@orange-10: var(--orange-10);
@yellow-1: var(--yellow-1);
@yellow-2: var(--yellow-2);
@yellow-3: var(--yellow-3);
@yellow-4: var(--yellow-4);
@yellow-5: var(--yellow-5);
@yellow-7: var(--yellow-7);
@yellow-8: var(--yellow-8);
@yellow-9: var(--yellow-9);
@yellow-10: var(--yellow-10);
@volcano-1: var(--volcano-1);
@volcano-2: var(--volcano-2);
@volcano-3: var(--volcano-3);
@volcano-4: var(--volcano-4);
@volcano-5: var(--volcano-5);
@volcano-7: var(--volcano-7);
@volcano-8: var(--volcano-8);
@volcano-9: var(--volcano-9);
@volcano-10: var(--volcano-10);
@geekblue-1: var(--geekblue-1);
@geekblue-2: var(--geekblue-2);
@geekblue-3: var(--geekblue-3);
@geekblue-4: var(--geekblue-4);
@geekblue-5: var(--geekblue-5);
@geekblue-7: var(--geekblue-7);
@geekblue-8: var(--geekblue-8);
@geekblue-9: var(--geekblue-9);
@geekblue-10: var(--geekblue-10);
@lime-1: var(--lime-1);
@lime-2: var(--lime-2);
@lime-3: var(--lime-3);
@lime-4: var(--lime-4);
@lime-5: var(--lime-5);
@lime-7: var(--lime-7);
@lime-8: var(--lime-8);
@lime-9: var(--lime-9);
@lime-10: var(--lime-10);
@gold-1: var(--gold-1);
@gold-2: var(--gold-2);
@gold-3: var(--gold-3);
@gold-4: var(--gold-4);
@gold-5: var(--gold-5);
@gold-7: var(--gold-7);
@gold-8: var(--gold-8);
@gold-9: var(--gold-9);
@gold-10: var(--gold-10);
@white: var(--white);
@text-color: var(--text-color);

/** 非颜色变量(这些变量暂时不用，直接用lessVars3.x.less) */
// @font-size-base: var(--font-size-base);
// @heading-1-size: var(--heading-1-size);
// @heading-2-size: var(--heading-2-size);
// @heading-3-size: var(--heading-3-size);
// @heading-4-size: var(--heading-4-size);
// @line-height-sm: var(--line-height-sm);
// @line-height-lg: var(--line-height-lg);
// @line-height-xl: var(--line-height-xl);
// @heading-1-line-height: var(--heading-1-line-height);
// @heading-2-line-height: var(--heading-2-line-height);
// @heading-3-line-height: var(--heading-3-line-height);
// @heading-4-line-height: var(--heading-4-line-height);
@border-radius-base: var(--border-radius-base);
@border-radius-sm: var(--border-radius-sm);
@border-radius-xs: var(--border-radius-xs);
@border-radius-lg: var(--border-radius-lg);
// @padding-xxs: var(--padding-xxs);
// @padding-base: var(--padding-base);
// @padding-xxl: var(--padding-xxl);
// @padding-xl: var(--padding-xl);
// @padding-lg: var(--padding-lg);
// @padding-md: var(--padding-md);
// @margin-xxs: var(--margin-xxs);
// @margin-xs: var(--margin-xs);
// @margin-sm: var(--margin-sm);
// @margin-base: var(--margin-base);
// @margin-md: var(--margin-md);
// @margin-lg: var(--margin-lg);
// @margin-xl: var(--margin-xl);
// @margin-xxl: var(--margin-xxl);
// @box-shadow-md: var(--box-shadow-md);
// @box-shadow-lg: var(--box-shadow-lg);

/** 这几个变量涉及到计算，所以不能变成css变量  */
@padding-sm: 12px;
@padding-xs: 8px;
@line-height-base: 22 / 14;