✨ feat: 样式调整
This commit is contained in:
@@ -14,7 +14,7 @@
|
||||
}
|
||||
|
||||
.sidebarHide {
|
||||
margin-left: 0!important;
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
|
||||
.sidebar-container {
|
||||
@@ -86,7 +86,8 @@
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.el-menu-item, .el-submenu__title {
|
||||
.el-menu-item,
|
||||
.el-submenu__title {
|
||||
// 明确默认状态样式(关键修复)
|
||||
background: transparent !important;
|
||||
box-shadow: none !important;
|
||||
@@ -107,12 +108,12 @@
|
||||
background: rgba(255, 255, 255, 0.1) !important;
|
||||
color: var(--text-primary) !important; // hover时文本更深
|
||||
box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.1),
|
||||
inset -1px -1px 2px rgba(255, 255, 255, 0.05);
|
||||
inset -1px -1px 2px rgba(255, 255, 255, 0.05);
|
||||
}
|
||||
}
|
||||
|
||||
// 深色主题下子菜单选中高亮
|
||||
& .theme-dark .is-active > .el-submenu__title {
|
||||
& .theme-dark .is-active>.el-submenu__title {
|
||||
color: #fff !important; // 选中时文字纯白
|
||||
// background-color: rgba(95, 123, 160, 0.25) !important; // 工业蓝浅高亮
|
||||
// border-left: 3px solid #5F7BA0; // 左边高亮条
|
||||
@@ -152,6 +153,13 @@
|
||||
}
|
||||
}
|
||||
|
||||
.el-menu-item.is-active.submenu-title-noDropdown {
|
||||
background: rgba(95, 123, 160, 0.28) !important; // 激活背景
|
||||
color: #fff !important; // 激活文字白色
|
||||
font-weight: 600;
|
||||
border-left: 3px solid #5F7BA0; // 左边高亮条
|
||||
}
|
||||
|
||||
.hideSidebar {
|
||||
.sidebar-container {
|
||||
width: 54px !important;
|
||||
@@ -205,6 +213,10 @@
|
||||
min-width: $base-sidebar-width !important;
|
||||
}
|
||||
|
||||
.el-submenu .el-menu{
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
// mobile responsive
|
||||
.mobile {
|
||||
.main-container {
|
||||
@@ -227,6 +239,7 @@
|
||||
}
|
||||
|
||||
.withoutAnimation {
|
||||
|
||||
.main-container,
|
||||
.sidebar-container {
|
||||
transition: none;
|
||||
@@ -252,7 +265,7 @@
|
||||
background: rgba(255, 255, 255, 0.1) !important;
|
||||
color: var(--text-primary) !important;
|
||||
box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.1),
|
||||
inset -1px -1px 2px rgba(255, 255, 255, 0.05);
|
||||
inset -1px -1px 2px rgba(255, 255, 255, 0.05);
|
||||
}
|
||||
|
||||
::v-deep &.is-active {
|
||||
@@ -261,7 +274,7 @@
|
||||
font-weight: 600;
|
||||
border-left: 3px solid #5F7BA0;
|
||||
box-shadow: inset 1px 1px 2px rgba(0, 0, 0, 0.15),
|
||||
inset -1px -1px 2px rgba(255, 255, 255, 0.08);
|
||||
inset -1px -1px 2px rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
::v-deep .el-menu-item.is-active span,
|
||||
@@ -288,12 +301,12 @@
|
||||
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background: #8d939b;
|
||||
border-radius: 3px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#app .sidebar-container .el-menu-item,
|
||||
#app .sidebar-container .el-menu-item,
|
||||
#app .sidebar-container .el-submenu__title {
|
||||
margin: 0;
|
||||
}
|
||||
Reference in New Issue
Block a user