fix(mail): 修复邮件列表工具栏标题与选中计数换行错乱
- 标题与「已选 x 封」计数包裹进同一 flex 容器(align-items: baseline) - white-space nowrap 禁止换行、计数 flex-shrink 0、工具栏 overflow hidden
This commit is contained in:
1 parent
ebb77fa632
commit
162f713b2e
1 file changed
+15
-2
@@ -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;
|
||||
|
||||
Reference in new issue
Block a user