Browse Source

fix: menu style (#43656)

pull/43662/head
MadCcc 1 year ago
committed by GitHub
parent
commit
473130fe32
No known key found for this signature in database GPG Key ID: 4AEE18F83AFDEB23
  1. 2
      components/menu/style/index.tsx
  2. 17
      components/menu/style/theme.tsx

2
components/menu/style/index.tsx

@ -941,7 +941,7 @@ export default (prefixCls: string, injectStyle: boolean): UseComponentStyleResul
colorItemBgHover: colorBgTextHover, colorItemBgHover: colorBgTextHover,
itemHoverBg: colorBgTextHover, itemHoverBg: colorBgTextHover,
colorItemBgActive: colorFillContent, colorItemBgActive: colorFillContent,
itemActiveBg: colorFillContent, itemActiveBg: controlItemBgActive,
colorSubItemBg: colorFillAlter, colorSubItemBg: colorFillAlter,
subMenuItemBg: colorFillAlter, subMenuItemBg: colorFillAlter,
colorItemBgSelected: controlItemBgActive, colorItemBgSelected: controlItemBgActive,

17
components/menu/style/theme.tsx

@ -38,6 +38,7 @@ const getThemeStyle = (token: MenuToken, themeSuffix: string): CSSInterpolation
dangerItemSelectedBg, dangerItemSelectedBg,
itemHoverBg, itemHoverBg,
itemActiveBg,
menuSubMenuBg, menuSubMenuBg,
// Horizontal // Horizontal
@ -75,11 +76,12 @@ const getThemeStyle = (token: MenuToken, themeSuffix: string): CSSInterpolation
}, },
// Hover // Hover
[`${componentCls}-item:hover, ${componentCls}-submenu-title:hover`]: { [`${componentCls}-item:not(${componentCls}-item-selected):not(${componentCls}-submenu-selected)`]:
[`&:not(${componentCls}-item-selected):not(${componentCls}-submenu-selected)`]: { {
color: itemHoverColor, [`&:hover, > ${componentCls}-submenu-title:hover`]: {
color: itemHoverColor,
},
}, },
},
[`&:not(${componentCls}-horizontal)`]: { [`&:not(${componentCls}-horizontal)`]: {
[`${componentCls}-item:not(${componentCls}-item-selected)`]: { [`${componentCls}-item:not(${componentCls}-item-selected)`]: {
@ -88,7 +90,7 @@ const getThemeStyle = (token: MenuToken, themeSuffix: string): CSSInterpolation
}, },
'&:active': { '&:active': {
backgroundColor: itemSelectedBg, backgroundColor: itemActiveBg,
}, },
}, },
@ -98,7 +100,7 @@ const getThemeStyle = (token: MenuToken, themeSuffix: string): CSSInterpolation
}, },
'&:active': { '&:active': {
backgroundColor: itemSelectedBg, backgroundColor: itemActiveBg,
}, },
}, },
}, },
@ -193,6 +195,9 @@ const getThemeStyle = (token: MenuToken, themeSuffix: string): CSSInterpolation
[`&-selected`]: { [`&-selected`]: {
color: horizontalItemSelectedColor, color: horizontalItemSelectedColor,
backgroundColor: horizontalItemSelectedBg, backgroundColor: horizontalItemSelectedBg,
'&:hover': {
backgroundColor: horizontalItemSelectedBg,
},
'&::after': { '&::after': {
borderBottomWidth: activeBarHeight, borderBottomWidth: activeBarHeight,
borderBottomColor: horizontalItemSelectedColor, borderBottomColor: horizontalItemSelectedColor,

Loading…
Cancel
Save