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

优化按钮水平排列和垂直对齐

Browse Source
This commit is contained in:
smail 2026-10-16 01:57:10 +08:00
parent fd65831aba
commit 67ce94b843
6 changed files with 69 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
frontend/src/views/components/ConfigSettings/ConfigEditor/ConfigEditor.css
View File

@ -37,9 +37,10 @@
.overview-actions {
display: flex;
align-items: center;
flex-wrap: wrap;
flex-wrap: nowrap;
justify-content: flex-end;
gap: 8px;
min-width: 0;
padding-top: 0;
}
@ -56,13 +57,20 @@
display: flex;
align-items: center;
justify-content: flex-end;
flex-wrap: wrap;
flex-wrap: nowrap;
gap: 10px;
min-width: 0;
}
.action-row :deep(.el-button) {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
min-width: 112px;
margin-left: 0;
margin-right: 0;
white-space: nowrap;
}
.overview-meta {
@ -147,11 +155,13 @@
.overview-actions {
justify-content: flex-start;
flex-wrap: wrap;
padding-top: 0;
}
.action-row {
justify-content: stretch;
flex-wrap: wrap;
}
.action-row :deep(.el-button) {

12
frontend/src/views/components/ConfigSettings/ConfigField/ConfigField.css
View File

@ -95,6 +95,7 @@
.field-list-row {
display: grid;
align-items: center;
grid-template-columns: minmax(0, 1fr) auto;
gap: 8px;
}
@ -115,6 +116,17 @@
margin-left: 0;
}
.field-list-row :deep(.el-button),
.field-add,
.field-port-guide :deep(.el-button) {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
margin: 0;
white-space: nowrap;
}
.field-port-guide {
display: flex;
flex-wrap: wrap;

4
frontend/src/views/components/ConfigSettings/ConfigSettings.css
View File

@ -181,17 +181,21 @@
.action-row {
display: flex;
align-items: center;
justify-content: flex-start;
flex-wrap: wrap;
gap: 10px;
min-width: 0;
margin-top: 12px;
}
.action-row > .el-button {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
min-height: 32px;
margin-left: 0;
margin-right: 0;
white-space: nowrap;
}
.maintenance-heading {
display: flex;

17
frontend/src/views/components/ConfigSettings/RelayConfig/RelayConfig.css
View File

@ -16,6 +16,23 @@
gap: 16px;
}
.relay-item-actions,
.relay-editor-actions {
justify-content: flex-end;
flex-wrap: nowrap;
min-width: 0;
}
.relay-item-actions :deep(.el-button),
.relay-editor-actions :deep(.el-button) {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
margin: 0;
white-space: nowrap;
}
.relay-list-heading h5,
.relay-editor-heading h5 {
margin: 0;

10
frontend/src/views/components/RuleSettings/RuleSettings.css
View File

@ -77,9 +77,10 @@
.form-actions {
display: flex;
align-items: center;
flex-wrap: wrap;
flex-wrap: nowrap;
gap: 12px;
justify-content: flex-start;
min-width: 0;
margin-top: 12px;
}
@ -87,8 +88,10 @@
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
min-height: 32px;
margin: 0;
white-space: nowrap;
}
.add-btn {
@ -179,17 +182,20 @@
display: flex;
align-items: center;
justify-content: flex-end;
flex-wrap: wrap;
flex-wrap: nowrap;
gap: 10px;
min-width: 0;
}
.dialog-footer :deep(.el-button) {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
min-width: 88px;
min-height: 32px;
margin: 0;
white-space: nowrap;
}
.custom-divider {

20
frontend/src/views/components/UserManagement/UserManagement.css
View File

@ -119,8 +119,11 @@
}
.security-edit-item {
display: grid;
gap: 10px;
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 10px 16px;
padding: 12px;
border: 1px solid var(--pm-border-color);
border-radius: var(--pm-radius-sm);
@ -128,6 +131,8 @@
}
.security-edit-item > div {
flex: 1 1 180px;
min-width: 0;
display: flex;
align-items: center;
justify-content: space-between;
@ -145,8 +150,10 @@
}
.security-edit-item :deep(.el-button) {
width: 100%;
flex: 0 0 auto;
min-height: 32px;
margin: 0;
white-space: nowrap;
}
.status-switch {
@ -175,7 +182,7 @@
display: flex;
align-items: center;
justify-content: flex-end;
flex-wrap: wrap;
flex-wrap: nowrap;
gap: 8px;
flex: 0 1 auto;
min-width: 0;
@ -374,17 +381,20 @@
display: flex;
align-items: center;
justify-content: flex-end;
flex-wrap: wrap;
flex-wrap: nowrap;
gap: 10px;
min-width: 0;
}
.dialog-footer :deep(.el-button) {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
min-width: 88px;
min-height: 32px;
margin: 0;
white-space: nowrap;
}
@container settings-content (max-width: 760px) {