feat: 样式调整

This commit is contained in:
砂糖
2025-09-02 15:39:51 +08:00
parent 96b5c3ee45
commit 52cc671ca3
11 changed files with 68 additions and 29 deletions

View File

@@ -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;
}