mirror of
https://github.com/vbenjs/vben-admin-thin-next.git
synced 2025-01-23 17:50:22 +08:00
63 lines
1.8 KiB
TypeScript
63 lines
1.8 KiB
TypeScript
/**
|
|
* Vite plugin for website theme color switching
|
|
* https://github.com/anncwb/vite-plugin-theme
|
|
*/
|
|
import type { Plugin } from 'vite';
|
|
import path from 'path';
|
|
import {
|
|
viteThemePlugin,
|
|
antdDarkThemePlugin,
|
|
mixLighten,
|
|
mixDarken,
|
|
tinycolor,
|
|
} from 'vite-plugin-theme';
|
|
import { getThemeColors, generateColors } from '../../config/themeConfig';
|
|
import { generateModifyVars } from '../../generate/generateModifyVars';
|
|
|
|
export function configThemePlugin(isBuild: boolean): Plugin[] {
|
|
const colors = generateColors({
|
|
mixDarken,
|
|
mixLighten,
|
|
tinycolor,
|
|
});
|
|
const plugin = [
|
|
viteThemePlugin({
|
|
resolveSelector: (s) => {
|
|
s = s.trim();
|
|
switch (s) {
|
|
case '.ant-steps-item-process .ant-steps-item-icon > .ant-steps-icon':
|
|
return '.ant-steps-item-icon > .ant-steps-icon';
|
|
case '.ant-steps-item-icon > .ant-steps-icon':
|
|
return s;
|
|
}
|
|
|
|
return `[data-theme] ${s}`;
|
|
},
|
|
colorVariables: [...getThemeColors(), ...colors],
|
|
}),
|
|
antdDarkThemePlugin({
|
|
preloadFiles: [
|
|
path.resolve(process.cwd(), 'node_modules/ant-design-vue/dist/antd.less'),
|
|
path.resolve(process.cwd(), 'src/design/index.less'),
|
|
],
|
|
filter: (id) => (isBuild ? !id.endsWith('antd.less') : true),
|
|
// extractCss: false,
|
|
darkModifyVars: {
|
|
...generateModifyVars(true),
|
|
'text-color': '#c9d1d9',
|
|
'text-color-base': '#c9d1d9',
|
|
'component-background': '#151515',
|
|
// black: '#0e1117',
|
|
// #8b949e
|
|
'text-color-secondary': '#8b949e',
|
|
'border-color-base': '#303030',
|
|
// 'border-color-split': '#30363d',
|
|
'item-active-bg': '#111b26',
|
|
'content-background': '#ffffff0a', // Link color
|
|
},
|
|
}),
|
|
];
|
|
|
|
return (plugin as unknown) as Plugin[];
|
|
}
|