ant-design / ant-design/pro-components
🧐[问题]不是暗黑模式,如何只让菜单部分表先暗黑模式的效果
- Dominant language
- TypeScript
- Stars
- 4.8k
- Forks
- 1.4k
- Avg merge
- 10h 44m
- Merged PRs (30d)
- 3
Description
下面是根据官方文档进行的配置,但是效果不理想。想问一下,有没有现成的配置值,是暗黑模式的菜单表现
```
token={{
sider: {
colorMenuBackground: '#141414', // menu 的背景颜色
colorTextMenuTitle: '#ffffff', // sider 的标题字体颜色
colorMenuItemDivider: '#303030', // menuItem 分割线的颜色
colorTextMenu: '#ffffff', // menuItem 的字体颜色
colorTextMenuSecondary: 'rgba(255, 255, 255, 0.65)', // menu 的二级字体颜色,比如 footer 和 action 的 icon
colorTextMenuSelected: 'rgba(255, 255, 255, 0.85)', // menuItem 的选中字体颜色
colorTextMenuActive: 'rgba(255, 255, 255, 0.85)', // menuItem hover 的选中字体颜色
colorTextMenuItemHover: 'rgba(255, 255, 255, 0.75)', // menuItem 的 hover 字体颜色
colorBgMenuItemActive: '#1890ff', // menuItem 的点击时背景颜色
colorBgMenuItemHover: 'rgba(24, 144, 255, 0.1)', // menuItem 的 hover 背景颜色
colorBgMenuItemSelected: '#1890ff', // menuItem 的选中背景颜色
colorBgMenuItemCollapsedElevated: '#141414', // 收起 menuItem 的弹出菜单背景颜色
colorBgCollapsedButton: '#141414', // 展开收起按钮背景颜色
colorTextCollapsedButton: '#ffffff', // 展开收起按钮字体颜色
colorTextCollapsedButtonHover: 'rgba(255, 255, 255, 0.85)', // 展开收起按钮 hover 时字体颜色
},
}}
```
另外,好像菜单折叠后,展开的二级菜单背景色没有被自定义。

官方的示例也有这个问题

Contributor guide
Research direction
Start by reproducing the supplied token.sider configuration and the behavior shown in the official examples. Check how the menu behaves normally and after collapsing, especially the expanded secondary menu background. Done means the menu-only dark appearance and the collapsed submenu background both follow the documented custom colors.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- design, frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100