style(aside): 优化侧边栏切换按钮的布局适配

调整侧边栏展开/折叠状态下切换按钮的对齐方式和内边距,使其与菜单项排版保持一致
This commit is contained in:
Yuhang Wu
2026-10-26 15:01:49 +08:00
parent dad406b4cd
commit 04f6d3f851
+18
View File
@@ -164,9 +164,27 @@ const statusText = computed(() => {
.sidebar-toggle {
width: 100%;
height: 44px;
border: 0;
border-radius: 10px;
}
/* 展开时沿用菜单项的左内边距,让折叠操作与“设置”入口排成同一列。 */
.app-sidebar:not(.is-collapsed) .sidebar-toggle {
justify-content: flex-start;
gap: 10px;
padding-inline: 24px;
:deep(.anticon + span) {
margin-inline-start: 0;
}
}
/* 折叠时隐藏文字后,按钮和菜单图标都回到侧栏中心。 */
.app-sidebar.is-collapsed .sidebar-toggle {
justify-content: center;
padding-inline: 0;
}
.sidebar-toggle:focus-visible {
outline: 2px solid #6366f1;
outline-offset: -2px;