mirror of
https://github.com/veops/cmdb.git
synced 2025-10-31 19:39:24 +08:00
47 lines
3.2 KiB
JavaScript
47 lines
3.2 KiB
JavaScript
const ThemeColorReplacer = require('webpack-theme-color-replacer')
|
||
const generate = require('@ant-design/colors/lib/generate').default
|
||
|
||
const getAntdSerials = (color) => {
|
||
// 淡化（即less的tint）
|
||
const lightens = new Array(9).fill().map((t, i) => {
|
||
return ThemeColorReplacer.varyColor.lighten(color, i / 10)
|
||
})
|
||
const colorPalettes = generate(color)
|
||
const rgb = ThemeColorReplacer.varyColor.toNum3(color.replace('#', '')).join(',')
|
||
return lightens.concat(colorPalettes).concat(rgb)
|
||
}
|
||
|
||
const themePluginOption = {
|
||
fileName: 'css/theme-colors-[contenthash:8].css',
|
||
matchColors: getAntdSerials('#2f54eb'), // 主色系列
|
||
// 改变样式选择器，解决样式覆盖问题
|
||
changeSelector (selector) {
|
||
switch (selector) {
|
||
case '.ant-calendar-today .ant-calendar-date':
|
||
return ':not(.ant-calendar-selected-date):not(.ant-calendar-selected-day)' + selector
|
||
case '.ant-btn:focus,.ant-btn:hover':
|
||
return '.ant-btn:focus:not(.ant-btn-primary):not(.ant-btn-danger),.ant-btn:hover:not(.ant-btn-primary):not(.ant-btn-danger)'
|
||
case '.ant-btn.active,.ant-btn:active':
|
||
return '.ant-btn.active:not(.ant-btn-primary):not(.ant-btn-danger),.ant-btn:active:not(.ant-btn-primary):not(.ant-btn-danger)'
|
||
case '.ant-steps-item-process .ant-steps-item-icon > .ant-steps-icon':
|
||
case '.ant-steps-item-process .ant-steps-item-icon>.ant-steps-icon':
|
||
return ':not(.ant-steps-item-process)' + selector
|
||
case '.ant-menu-horizontal>.ant-menu-item-active,.ant-menu-horizontal>.ant-menu-item-open,.ant-menu-horizontal>.ant-menu-item-selected,.ant-menu-horizontal>.ant-menu-item:hover,.ant-menu-horizontal>.ant-menu-submenu-active,.ant-menu-horizontal>.ant-menu-submenu-open,.ant-menu-horizontal>.ant-menu-submenu-selected,.ant-menu-horizontal>.ant-menu-submenu:hover':
|
||
case '.ant-menu-horizontal > .ant-menu-item-active,.ant-menu-horizontal > .ant-menu-item-open,.ant-menu-horizontal > .ant-menu-item-selected,.ant-menu-horizontal > .ant-menu-item:hover,.ant-menu-horizontal > .ant-menu-submenu-active,.ant-menu-horizontal > .ant-menu-submenu-open,.ant-menu-horizontal > .ant-menu-submenu-selected,.ant-menu-horizontal > .ant-menu-submenu:hover':
|
||
return '.ant-menu-horizontal > .ant-menu-item-active,.ant-menu-horizontal > .ant-menu-item-open,.ant-menu-horizontal > .ant-menu-item-selected,.ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-item:hover,.ant-menu-horizontal > .ant-menu-submenu-active,.ant-menu-horizontal > .ant-menu-submenu-open,.ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-submenu-selected,.ant-menu-horizontal:not(.ant-menu-dark) > .ant-menu-submenu:hover'
|
||
case '.ant-menu-horizontal > .ant-menu-item-selected > a':
|
||
case '.ant-menu-horizontal>.ant-menu-item-selected>a':
|
||
return '.ant-menu-horizontal:not(ant-menu-light):not(.ant-menu-dark) > .ant-menu-item-selected > a'
|
||
case '.ant-menu-horizontal > .ant-menu-item > a:hover':
|
||
case '.ant-menu-horizontal>.ant-menu-item>a:hover':
|
||
return '.ant-menu-horizontal:not(ant-menu-light):not(.ant-menu-dark) > .ant-menu-item > a:hover'
|
||
default :
|
||
return selector
|
||
}
|
||
}
|
||
}
|
||
|
||
const createThemeColorReplacerPlugin = () => new ThemeColorReplacer(themePluginOption)
|
||
|
||
module.exports = createThemeColorReplacerPlugin
|