fix(): 在文件顶部添加了完整的 Ant Design Menu 深色主题覆盖
- 包含了常规菜单项、折叠菜单项、悬停状态和选中状态的样式
- 确保所有状态下的颜色都与深色主题协调一致
This commit is contained in:
@@ -78,6 +78,7 @@
|
|||||||
/* 折叠时的样式 */
|
/* 折叠时的样式 */
|
||||||
.dynamic-menu-wrapper .ant-menu-inline-collapsed {
|
.dynamic-menu-wrapper .ant-menu-inline-collapsed {
|
||||||
width: 100% !important;
|
width: 100% !important;
|
||||||
|
background: transparent !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dynamic-menu-wrapper .ant-menu-inline-collapsed > .ant-menu-item,
|
.dynamic-menu-wrapper .ant-menu-inline-collapsed > .ant-menu-item,
|
||||||
@@ -89,6 +90,13 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
background: transparent !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dynamic-menu-wrapper .ant-menu-inline-collapsed > .ant-menu-item:hover,
|
||||||
|
.dynamic-menu-wrapper .ant-menu-inline-collapsed > .ant-menu-submenu > .ant-menu-submenu-title:hover {
|
||||||
|
background: linear-gradient(135deg, rgba(124, 92, 255, 0.08) 0%, rgba(124, 92, 255, 0.05) 100%) !important;
|
||||||
|
border-color: rgba(124, 92, 255, 0.15) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dynamic-menu-wrapper .ant-menu-inline-collapsed .ant-menu-item-icon {
|
.dynamic-menu-wrapper .ant-menu-inline-collapsed .ant-menu-item-icon {
|
||||||
@@ -100,6 +108,17 @@
|
|||||||
font-size: 22px;
|
font-size: 22px;
|
||||||
line-height: 42px;
|
line-height: 42px;
|
||||||
margin: 0 !important;
|
margin: 0 !important;
|
||||||
|
color: var(--text) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dynamic-menu-wrapper .ant-menu-inline-collapsed > .ant-menu-item-selected,
|
||||||
|
.dynamic-menu-wrapper .ant-menu-inline-collapsed > .ant-menu-item-selected:hover {
|
||||||
|
background: linear-gradient(135deg, rgba(124, 92, 255, 0.12) 0%, rgba(124, 92, 255, 0.08) 100%) !important;
|
||||||
|
border-color: rgba(124, 92, 255, 0.2) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dynamic-menu-wrapper .ant-menu-inline-collapsed > .ant-menu-item-selected .anticon {
|
||||||
|
color: var(--accent) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 子菜单样式 */
|
/* 子菜单样式 */
|
||||||
|
|||||||
@@ -1,5 +1,64 @@
|
|||||||
/* 深色科技风主题覆盖样式 - 参考 x.ai */
|
/* 深色科技风主题覆盖样式 - 参考 x.ai */
|
||||||
|
|
||||||
|
/* Ant Design 深色主题覆盖 */
|
||||||
|
.ant-menu {
|
||||||
|
background: transparent !important;
|
||||||
|
color: var(--text) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-menu-item,
|
||||||
|
.ant-menu-submenu-title {
|
||||||
|
color: var(--text) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-menu-item:hover,
|
||||||
|
.ant-menu-submenu-title:hover {
|
||||||
|
color: var(--text) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-menu-item-selected {
|
||||||
|
color: var(--text) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-menu-item .anticon,
|
||||||
|
.ant-menu-submenu-title .anticon {
|
||||||
|
color: var(--text) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 折叠菜单深色样式 */
|
||||||
|
.ant-menu-inline-collapsed {
|
||||||
|
background: transparent !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-menu-inline-collapsed .ant-menu-item {
|
||||||
|
background: transparent !important;
|
||||||
|
color: var(--text) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-menu-inline-collapsed .ant-menu-item .anticon {
|
||||||
|
color: var(--text) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-menu-inline-collapsed .ant-menu-item-selected .anticon {
|
||||||
|
color: var(--accent) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Tooltip 深色主题 */
|
||||||
|
.ant-tooltip {
|
||||||
|
background: var(--panel-solid) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-tooltip-inner {
|
||||||
|
background: var(--panel-solid) !important;
|
||||||
|
color: var(--text) !important;
|
||||||
|
border: 1px solid var(--border);
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-tooltip-arrow::before {
|
||||||
|
background: var(--panel-solid) !important;
|
||||||
|
border: 1px solid var(--border);
|
||||||
|
}
|
||||||
|
|
||||||
/* 容器层级 */
|
/* 容器层级 */
|
||||||
.container {
|
.container {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|||||||
Reference in New Issue
Block a user