style(sidebar): 优化侧边菜单样式与标识逻辑

1.  移除原有二级菜单叶子节点的小圆点样式
2.  新增子菜单标识图标组件,为有子级的菜单添加折叠箭头标识
3.  调整菜单标题渲染逻辑,统一标题样式处理
4.  修复菜单容器的定位样式问题
This commit is contained in:
2026-06-11 15:31:23 +08:00
parent e1bb9e5431
commit 7440706e2e
3 changed files with 35 additions and 20 deletions

View File

@@ -93,6 +93,7 @@
// 明确默认状态样式(关键修复)
background: transparent !important;
box-shadow: none !important;
position: relative;
overflow: hidden !important;
text-overflow: ellipsis !important;
@@ -305,15 +306,16 @@
margin: 0 4px;
}
// 二级菜单叶子页面小圆点
.el-menu-item.is-page-item::before {
content: '';
display: inline-block;
width: 6px;
height: 6px;
border-radius: 50%;
background: var(--current-color, #409EFF);
margin-right: 8px;
flex-shrink: 0;
vertical-align: middle;
}
// 子菜单标识图标
.submenu-indicator {
position: absolute;
right: 10px;
top: 50%;
transform: translateY(-50%);
display: inline-flex;
align-items: center;
opacity: 0.5;
font-size: 12px;
}
// 叶子页面无标识