fix(mail): 修复邮件列表工具栏标题与选中计数换行错乱

- 标题与「已选 x 封」计数包裹进同一 flex 容器(align-items: baseline) - white-space nowrap 禁止换行、计数 flex-shrink 0、工具栏 overflow hidden
This commit is contained in:
TermiNexus committed 2026-08-08 16:12:22 +08:00
1 parent ebb77fa632
commit 162f713b2e
1 file changed
+15 -2
+15 -2
View File
@@ -602,8 +602,10 @@ function isSelected(id: string): boolean {
<section class="mail-list-pane">
<div class="list-toolbar">
<el-checkbox :model-value="allChecked" :indeterminate="someChecked" @change="toggleSelectAll" title="全选" />
<span class="toolbar-title">{{ currentFolderName }}</span>
<span v-if="selectedIds.length" class="toolbar-count">已选 {{ selectedIds.length }} 封</span>
<div class="toolbar-left">
<span class="toolbar-title">{{ currentFolderName }}</span>
<span v-if="selectedIds.length" class="toolbar-count">已选 {{ selectedIds.length }} 封</span>
</div>
<div class="spacer" />
<el-tooltip content="刷新">
<el-button text size="small" :icon="Refresh" @click="loadEmails" />
@@ -960,18 +962,29 @@ html.dark .mail-login-wrap {
gap: 6px;
padding: 0 10px;
border-bottom: 1px solid var(--el-border-color-lighter);
overflow: hidden;
white-space: nowrap;
}
.list-toolbar .spacer {
flex: 1;
}
.toolbar-left {
display: flex;
align-items: baseline;
gap: 8px;
min-width: 0;
}
.toolbar-title {
font-size: 14px;
font-weight: 600;
color: var(--el-text-color-primary);
white-space: nowrap;
}
.toolbar-count {
font-size: 12px;
color: var(--el-color-primary);
white-space: nowrap;
flex-shrink: 0;
}
.email-list {
flex: 1;