xuans/Smail
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

修复系统发信配置横向溢出
Some checks are pending
Security Checks / security (push) Waiting to run
Details

Browse Source 
调整账号授权表格和 SMTP 配置的自适应宽度，确保系统发信配置在常用桌面尺寸内完整显示。
This commit is contained in:
smail 2026-09-27 15:21:56 +08:00
parent 498493374e
commit 8663521bce
1 changed files with 70 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
frontend/src/views/components/SystemNotification/SystemNotification.css
View File

@ -223,7 +223,7 @@
/* Desktop manager layout: keep the authorization list and selected account settings visible together. */
.notification-settings:has(> .notification-manager-panel) {
display: grid;
grid-template-columns: minmax(240px, 0.44fr) minmax(580px, 1.56fr);
grid-template-columns: minmax(220px, 0.44fr) minmax(0, 1.56fr);
align-items: start;
gap: 8px 10px;
min-width: 0;
@ -303,7 +303,7 @@
.notification-settings:has(> .notification-manager-panel) > .notification-detail-panel .notification-columns {
display: grid;
grid-template-columns: minmax(260px, 0.72fr) minmax(360px, 1.28fr);
grid-template-columns: minmax(0, 0.72fr) minmax(0, 1.28fr);
gap: 6px 10px;
align-items: start;
}
@ -536,3 +536,71 @@
display: table-row;
}
}
/* Keep the manager table and SMTP summary inside the available dialog width. */
.notification-settings:has(> .notification-manager-panel) > .notification-manager-panel :deep(.el-table),
.notification-settings:has(> .notification-manager-panel) > .notification-manager-panel :deep(.el-table__header-wrapper table),
.notification-settings:has(> .notification-manager-panel) > .notification-manager-panel :deep(.el-table__body-wrapper table) {
width: 100% !important;
min-width: 0 !important;
table-layout: fixed;
}
.notification-settings:has(> .notification-manager-panel) > .notification-manager-panel :deep(.el-table col:nth-child(1)) {
width: 27% !important;
}
.notification-settings:has(> .notification-manager-panel) > .notification-manager-panel :deep(.el-table col:nth-child(2)) {
width: 21% !important;
}
.notification-settings:has(> .notification-manager-panel) > .notification-manager-panel :deep(.el-table col:nth-child(3)) {
width: 31% !important;
}
.notification-settings:has(> .notification-manager-panel) > .notification-manager-panel :deep(.el-table col:nth-child(4)) {
width: 21% !important;
}
.notification-settings:has(> .notification-manager-panel) > .notification-manager-panel :deep(.el-table .cell) {
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.notification-settings:has(> .notification-manager-panel) > .notification-manager-panel :deep(.el-table .el-tag) {
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
}
.notification-settings:has(> .notification-manager-panel) > .notification-detail-panel .notification-columns > :deep(.el-descriptions) {
width: 100%;
max-width: 100%;
min-width: 0;
}
.notification-settings:has(> .notification-manager-panel) > .notification-detail-panel .notification-columns > :deep(.el-descriptions__body),
.notification-settings:has(> .notification-manager-panel) > .notification-detail-panel .notification-columns > :deep(.el-descriptions__table) {
width: 100%;
max-width: 100%;
min-width: 0;
}
.notification-settings:has(> .notification-manager-panel) > .notification-detail-panel .notification-columns > :deep(.el-descriptions ~ .el-descriptions) .el-descriptions__body > table > tbody,
.notification-settings:has(> .notification-manager-panel) > .notification-detail-panel .notification-columns > :deep(.el-descriptions ~ .el-descriptions) .el-descriptions__body > table > tbody > tr {
min-width: 0;
width: 100%;
max-width: 100%;
}
.notification-settings:has(> .notification-manager-panel) > .notification-detail-panel .notification-columns > :deep(.el-descriptions ~ .el-descriptions) .el-descriptions__body > table > tbody > tr > td {
min-width: 0;
max-width: 100%;
}
.notification-settings:has(> .notification-manager-panel) > .notification-detail-panel .notification-columns > :deep(.el-descriptions ~ .el-descriptions) code {
display: inline;
max-width: 100%;
overflow-wrap: anywhere;
}