98 lines
2.9 KiB
JavaScript
98 lines
2.9 KiB
JavaScript
// 自定义主题色后，会有部分css不符合预期，出现了权重问题，将其原始样式写在此处
|
||
// 具体情况见文档 https://github.com/GitOfZGT/vite-plugin-theme-preprocessor/blob/master/README.zh.md
|
||
const includeStyles = {
|
||
'.ant-btn-primary:hover, .ant-btn-primary:focus': {
|
||
color: '#FFFFFF'
|
||
},
|
||
'.ant-btn-danger:hover, .ant-btn-danger:focus': {
|
||
color: '#fff',
|
||
'border-color': '#ff4d4f',
|
||
background: '#ff4d4f'
|
||
},
|
||
'.ant-btn-danger:active': {
|
||
color: '#fff',
|
||
'border-color': '#cf1322',
|
||
background: '#cf1322'
|
||
},
|
||
'.ant-btn-danger': {
|
||
'border-color': '#f5222d',
|
||
background: '#f5222d',
|
||
'text-shadow': '0 -1px 0 rgba(0, 0, 0, 0.12)',
|
||
'box-shadow': '0 2px 0 rgba(0, 0, 0, 0.045)'
|
||
},
|
||
'.ant-btn-dangerous:hover, .ant-btn-dangerous:focus': {
|
||
color: '#ff4d4f',
|
||
'border-color': '#ff4d4f'
|
||
},
|
||
'.ant-btn-dangerous:active': {
|
||
color: '#cf1322',
|
||
'border-color': '#cf1322'
|
||
}
|
||
}
|
||
|
||
export default {
|
||
less: {
|
||
// 是否启用任意主题色模式，这里不启用
|
||
arbitraryMode: false,
|
||
|
||
// 提供多组变量文件
|
||
multipleScopeVars: [
|
||
{
|
||
// 必需
|
||
scopeName: 'theme-default',
|
||
// path 和 varsContent 必选一个
|
||
// path: resolve('src/theme/theme-default.less'),
|
||
// varsContent参数等效于 path文件的内容
|
||
// 注意末尾加冒号
|
||
varsContent: `var(--ant-primary-color):#1965FF;@primary-glass:#1965FF26;`,
|
||
includeStyles
|
||
},
|
||
{
|
||
scopeName: 'theme-red',
|
||
varsContent: `var(--ant-primary-color):#F56C6C;@primary-glass:#F56C6C26;`,
|
||
includeStyles
|
||
},
|
||
{
|
||
scopeName: 'theme-blue',
|
||
varsContent: `var(--ant-primary-color):#409EFF;@primary-glass:#409EFF26;`,
|
||
includeStyles
|
||
},
|
||
{
|
||
scopeName: 'theme-green',
|
||
varsContent: `var(--ant-primary-color):#67C23A;@primary-glass:#67C23A26;`,
|
||
includeStyles
|
||
},
|
||
{
|
||
scopeName: 'theme-orange',
|
||
varsContent: `var(--ant-primary-color):#FF9326;@primary-glass:#FF932626;`,
|
||
includeStyles
|
||
},
|
||
{
|
||
scopeName: 'theme-purple',
|
||
varsContent: `var(--ant-primary-color):#A126FF;@primary-glass:#A126FF26;`,
|
||
includeStyles
|
||
},
|
||
{
|
||
scopeName: 'theme-black',
|
||
varsContent: `var(--ant-primary-color):#6C6F91;
|
||
@primary-glass:#6C6F9126;`,
|
||
includeStyles
|
||
}
|
||
],
|
||
// 【注意】includeStyleWithColors作用： css中不是由主题色变量生成的颜色，也让它抽取到主题css内，可以提高权重
|
||
includeStyleWithColors: [
|
||
{
|
||
// color也可以是array，如 ["#ffffff","#000"]
|
||
color: '#ffffff'
|
||
},
|
||
{
|
||
// @zougt/some-loader-utils v1.4.2 支持 "transparent" 、"none" 等等
|
||
color: ['transparent', 'none']
|
||
}
|
||
],
|
||
|
||
// 在生产模式是否抽取独立的主题css文件，extract为true以下属性有效
|
||
extract: false
|
||
}
|
||
}
|