style(aside): 优化侧边栏切换按钮的布局适配
调整侧边栏展开/折叠状态下切换按钮的对齐方式和内边距,使其与菜单项排版保持一致
This commit is contained in:
@@ -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;
|
||||
|
||||
Reference in New Issue
Block a user