// 使用函数全部生成没有提示
|
// function genThemeColor() {
|
// const colors = ['primary', 'success', 'warning', 'danger', 'info'];
|
// const colorMap = {};
|
// for (const item of colors) {
|
// const branchMap = {};
|
// for (let i = 1; i <= 4; i++) {
|
// const key = `light-${2 * i + 1}`;
|
// const colorValue = `var(--alloy-color-${item}-${key}`;
|
// branchMap[key] = colorValue;
|
// }
|
// branchMap['light-8'] = `var(--alloy-color-${item}-light-8)`;
|
// branchMap['dark-2'] = `var(--alloy-color-${item}-dark-2)`;
|
// branchMap['default'] = `var(--alloy-color-${item})`;
|
// colorMap[item] = branchMap;
|
// }
|
// return colorMap;
|
// }
|
|
const namespace = 'alloy';
|
|
function genThemeColor(branchName) {
|
return {
|
'light-3': `var(--${namespace}-color-${branchName}-light-3)`,
|
'light-5': `var(--${namespace}-color-${branchName}-light-5)`,
|
'light-7': `var(--${namespace}-color-${branchName}-light-7)`,
|
'light-8': `var(--${namespace}-color-${branchName}-light-8)`,
|
'light-9': `var(--${namespace}-color-${branchName}-light-9)`,
|
DEFAULT: `var(--${namespace}-color-${branchName})`,
|
'dark-2': `var(--${namespace}-color-${branchName}-dark-2)`,
|
};
|
}
|
|
/** @type {import('tailwindcss').Config} */
|
module.exports = {
|
content: ['./index.html', './src/**/*.{vue,js,ts,jsx,tsx}'],
|
theme: {
|
extend: {
|
fontWeight: {
|
'weight-default': `var(--${namespace}-font-weight-primary)`,
|
},
|
|
lineHeight: {
|
default: `var(--${namespace}-font-line-height-primary)`,
|
},
|
transitionDuration: {
|
default: `var(--${namespace}-transition-duration)`,
|
fast: `var(--${namespace}-transition-duration-fast)`,
|
},
|
borderRadius: {
|
base: `var(--${namespace}-border-radius-base)`,
|
small: `var(--${namespace}-border-radius-small)`,
|
round: `var(--${namespace}-border-radius-round)`,
|
circle: `var(--${namespace}-border-radius-circle)`,
|
},
|
},
|
|
fontFamily: {
|
'family-default': `var(--${namespace}-font-family)`,
|
},
|
fontSize: {
|
'extra-small': `var(--${namespace}-font-size-extra-small)`,
|
small: `var(--${namespace}-font-size-small)`,
|
base: `var(--${namespace}-font-size-base)`,
|
medium: `var(--${namespace}-font-size-medium)`,
|
large: `var(--${namespace}-font-size-large)`,
|
'extra-large': `var(--${namespace}-font-size-extra-large)`,
|
},
|
borderWidth: {
|
'w-default': `var(--${namespace}-border-width)`,
|
},
|
backgroundColor: {
|
primary: genThemeColor('primary'),
|
success: genThemeColor('success'),
|
warning: genThemeColor('warning'),
|
danger: genThemeColor('danger'),
|
info: genThemeColor('info'),
|
|
default: `var(--${namespace}-bg-color)`,
|
page: `var(--${namespace}-bg-color-page)`,
|
overlay: `var(--${namespace}-bg-color-overlay)`,
|
disabled: `var(--${namespace}-disabled-bg-color)`,
|
|
white: `var(--${namespace}-color-white)`,
|
black: `var(--${namespace}-color-black)`,
|
},
|
textColor: {
|
primary: genThemeColor('primary'),
|
success: genThemeColor('success'),
|
warning: genThemeColor('warning'),
|
danger: genThemeColor('danger'),
|
info: genThemeColor('info'),
|
white: `var(--${namespace}-color-white)`,
|
black: `var(--${namespace}-color-black)`,
|
'color-default': `var(--${namespace}-text-color-primary)`,
|
regular: `var(--${namespace}-text-color-regular)`,
|
secondary: `var(--${namespace}-text-color-secondary)`,
|
placeholder: `var(--${namespace}-text-color-placeholder)`,
|
disabled: `var(--${namespace}-text-color-disabled)`,
|
},
|
borderColor: {
|
primary: genThemeColor('primary'),
|
success: genThemeColor('success'),
|
warning: genThemeColor('warning'),
|
danger: genThemeColor('danger'),
|
info: genThemeColor('info'),
|
|
'color-default': `var(--${namespace}-border-color)`,
|
light: `var(--${namespace}-border-color-light)`,
|
lighter: `var(--${namespace}-border-color-lighter)`,
|
extraLight: `var(--${namespace}-border-color-extra-light)`,
|
dark: `var(--${namespace}-border-color-dark)`,
|
darker: `var(--${namespace}-border-color-darker)`,
|
hover: `var(--${namespace}-border-color-hover)`,
|
disabled: `var(--${namespace}-disabled-border-color)`,
|
},
|
},
|
corePlugins: {
|
preflight: false,
|
},
|
};
|
