/** Create color palette vars */
|
function createColorPaletteVars() {
|
const colors: App.Theme.ThemeColorKey[] = ['primary', 'info', 'success', 'warning', 'error'];
|
const colorPaletteNumbers: App.Theme.ColorPaletteNumber[] = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950];
|
|
const colorPaletteVar = {} as App.Theme.ThemePaletteColor;
|
|
colors.forEach(color => {
|
colorPaletteVar[color] = `rgb(var(--${color}-color))`;
|
colorPaletteNumbers.forEach(number => {
|
colorPaletteVar[`${color}-${number}`] = `rgb(var(--${color}-${number}-color))`;
|
});
|
});
|
|
return colorPaletteVar;
|
}
|
|
const colorPaletteVars = createColorPaletteVars();
|
|
/** Theme vars */
|
export const themeVars: App.Theme.ThemeTokenCSSVars = {
|
colors: {
|
...colorPaletteVars,
|
nprogress: 'rgb(var(--nprogress-color))',
|
container: 'rgb(var(--container-bg-color))',
|
layout: 'rgb(var(--layout-bg-color))',
|
inverted: 'rgb(var(--inverted-bg-color))',
|
'base-text': 'rgb(var(--base-text-color))'
|
},
|
boxShadow: {
|
header: 'var(--header-box-shadow)',
|
sider: 'var(--sider-box-shadow)',
|
tab: 'var(--tab-box-shadow)'
|
}
|
};
|
