yml/order_site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ui优化-3

Browse Source
This commit is contained in:
yml2213
2026-05-14 20:25:58 +08:00
parent 0288e8f578
commit a029da8c6d
3 changed files with 76 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/frontend/src/views/admin/AdminFulfillmentBindingsView.vue
+21 -21
View File
@@ -954,11 +954,11 @@ onMounted(loadConfigs)
align-items: center; align-items: center;
min-height: 28px; min-height: 28px;
padding: 0 10px; padding: 0 10px;
border-radius: 999px; border-radius: var(--radius-full);
background: rgba(37, 89, 167, 0.08); background: rgba(37, 89, 167, 0.08);
border: 1px solid rgba(37, 89, 167, 0.12); border: 1px solid rgba(37, 89, 167, 0.12);
color: var(--color-primary-dark); color: var(--color-primary-dark);
font-size: 12px; font-size: var(--text-xs);
font-weight: 700; font-weight: 700;
letter-spacing: 0.04em; letter-spacing: 0.04em;
} }
@@ -973,7 +973,7 @@ onMounted(loadConfigs)
.empty-block, .empty-block,
.error-copy { .error-copy {
padding: 16px; padding: 16px;
border-radius: 20px; border-radius: var(--radius-xl);
background: rgba(255, 255, 255, 0.94); background: rgba(255, 255, 255, 0.94);
border: 1px solid rgba(86, 108, 138, 0.1); border: 1px solid rgba(86, 108, 138, 0.1);
} }
@@ -1013,14 +1013,14 @@ onMounted(loadConfigs)
display: grid; display: grid;
gap: 4px; gap: 4px;
padding: 12px 14px; padding: 12px 14px;
border-radius: 16px; border-radius: var(--radius-lg);
background: #f8fafc; background: #f8fafc;
border: 1px solid rgba(148, 163, 184, 0.14); border: 1px solid rgba(148, 163, 184, 0.14);
} }
.overview-stat span { .overview-stat span {
color: var(--text-secondary); color: var(--text-secondary);
font-size: 12px; font-size: var(--text-xs);
font-weight: 700; font-weight: 700;
} }
@@ -1041,10 +1041,10 @@ onMounted(loadConfigs)
align-items: center; align-items: center;
min-height: 32px; min-height: 32px;
padding: 0 12px; padding: 0 12px;
border-radius: 999px; border-radius: var(--radius-full);
background: rgba(15, 23, 42, 0.04); background: rgba(15, 23, 42, 0.04);
color: var(--text-secondary); color: var(--text-secondary);
font-size: 12px; font-size: var(--text-xs);
font-weight: 600; font-weight: 600;
} }
@@ -1085,7 +1085,7 @@ onMounted(loadConfigs)
.toolbar-hint { .toolbar-hint {
margin: 10px 0 0; margin: 10px 0 0;
color: var(--text-secondary); color: var(--text-secondary);
font-size: 12px; font-size: var(--text-xs);
} }
.lookup-summary { .lookup-summary {
@@ -1097,7 +1097,7 @@ onMounted(loadConfigs)
display: grid; display: grid;
gap: 6px; gap: 6px;
padding: 12px 14px; padding: 12px 14px;
border-radius: 16px; border-radius: var(--radius-lg);
background: #f8fafc; background: #f8fafc;
border: 1px solid rgba(148, 163, 184, 0.14); border: 1px solid rgba(148, 163, 184, 0.14);
} }
@@ -1109,7 +1109,7 @@ onMounted(loadConfigs)
.binding-card { .binding-card {
margin-top: 12px; margin-top: 12px;
padding: 14px; padding: 14px;
border-radius: 16px; border-radius: var(--radius-lg);
background: #f8fafc; background: #f8fafc;
border: 1px solid rgba(148, 163, 184, 0.18); border: 1px solid rgba(148, 163, 184, 0.18);
} }
@@ -1142,17 +1142,17 @@ onMounted(loadConfigs)
.binding-subtle { .binding-subtle {
color: var(--text-secondary); color: var(--text-secondary);
font-size: 13px; font-size: var(--text-sm);
} }
.binding-status-chip { .binding-status-chip {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
border-radius: 999px; border-radius: var(--radius-full);
padding: 2px 10px; padding: 2px 10px;
background: #fff1f2; background: #fff1f2;
color: #be123c; color: #be123c;
font-size: 12px; font-size: var(--text-xs);
font-weight: 700; font-weight: 700;
} }
@@ -1165,7 +1165,7 @@ onMounted(loadConfigs)
border: 1px solid rgba(86, 108, 138, 0.18); border: 1px solid rgba(86, 108, 138, 0.18);
background: rgba(255, 255, 255, 0.96); background: rgba(255, 255, 255, 0.96);
color: var(--text-primary); color: var(--text-primary);
border-radius: 999px; border-radius: var(--radius-full);
padding: 7px 12px; padding: 7px 12px;
font: inherit; font: inherit;
cursor: pointer; cursor: pointer;
@@ -1175,7 +1175,7 @@ onMounted(loadConfigs)
display: grid; display: grid;
gap: 6px; gap: 6px;
color: var(--text-secondary); color: var(--text-secondary);
font-size: 13px; font-size: var(--text-sm);
} }
.binding-grid { .binding-grid {
@@ -1201,13 +1201,13 @@ onMounted(loadConfigs)
.field-block span { .field-block span {
color: var(--text-secondary); color: var(--text-secondary);
font-size: 12px; font-size: var(--text-xs);
font-weight: 700; font-weight: 700;
} }
.field-help { .field-help {
color: var(--text-secondary); color: var(--text-secondary);
font-size: 12px; font-size: var(--text-xs);
line-height: 1.5; line-height: 1.5;
} }
@@ -1243,7 +1243,7 @@ onMounted(loadConfigs)
.binding-inline-error { .binding-inline-error {
margin: 10px 0 0; margin: 10px 0 0;
color: var(--color-danger); color: var(--color-danger);
font-size: 13px; font-size: var(--text-sm);
font-weight: 600; font-weight: 600;
} }
@@ -1279,7 +1279,7 @@ onMounted(loadConfigs)
.data-table th { .data-table th {
color: var(--text-secondary); color: var(--text-secondary);
font-size: 13px; font-size: var(--text-sm);
} }
.cell-stack { .cell-stack {
@@ -1289,7 +1289,7 @@ onMounted(loadConfigs)
.cell-subtle { .cell-subtle {
color: var(--text-secondary); color: var(--text-secondary);
font-size: 12px; font-size: var(--text-xs);
} }
.empty-block, .empty-block,
@@ -1301,7 +1301,7 @@ onMounted(loadConfigs)
color: var(--color-danger); color: var(--color-danger);
} }
@media (max-width: 980px) { @media (max-width: 900px) {
.panel-header, .panel-header,
.section-title-row, .section-title-row,
.section-header-tools, .section-header-tools,
apps/frontend/src/views/admin/AdminKuaishouCloudFulfillmentView.vue
+54 -54
View File
@@ -1153,7 +1153,7 @@ onMounted(loadConfigs)
} }
.hero-copy h1 { .hero-copy h1 {
font-size: 24px; font-size: var(--text-2xl);
line-height: 1.2; line-height: 1.2;
} }
@@ -1162,7 +1162,7 @@ onMounted(loadConfigs)
} }
.pane-heading h3 { .pane-heading h3 {
font-size: 14px; font-size: var(--text-base);
} }
.hero-copy p { .hero-copy p {
@@ -1190,10 +1190,10 @@ onMounted(loadConfigs)
min-height: 34px; min-height: 34px;
padding: 0 10px; padding: 0 10px;
border: 1px solid var(--panel-border); border: 1px solid var(--panel-border);
border-radius: 8px; border-radius: var(--radius-sm);
background: #fff; background: #fff;
color: var(--panel-ink); color: var(--panel-ink);
font-size: 13px; font-size: var(--text-sm);
font-weight: 700; font-weight: 700;
} }
@@ -1207,7 +1207,7 @@ onMounted(loadConfigs)
min-width: 0; min-width: 0;
padding: 12px; padding: 12px;
border: 1px solid rgba(31, 42, 55, 0.08); border: 1px solid rgba(31, 42, 55, 0.08);
border-radius: 8px; border-radius: var(--radius-sm);
background: rgba(255, 255, 255, 0.82); background: rgba(255, 255, 255, 0.82);
} }
@@ -1218,14 +1218,14 @@ onMounted(loadConfigs)
.rule-footer, .rule-footer,
.field-help { .field-help {
color: var(--panel-muted); color: var(--panel-muted);
font-size: 12px; font-size: var(--text-xs);
} }
.status-strip strong { .status-strip strong {
display: block; display: block;
margin-top: 5px; margin-top: 5px;
color: var(--panel-ink); color: var(--panel-ink);
font-size: 24px; font-size: var(--text-2xl);
line-height: 1; line-height: 1;
} }
@@ -1235,7 +1235,7 @@ onMounted(loadConfigs)
overflow: hidden; overflow: hidden;
color: var(--panel-ink); color: var(--panel-ink);
font-family: var(--font-mono); font-family: var(--font-mono);
font-size: 12px; font-size: var(--text-xs);
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
@@ -1253,10 +1253,10 @@ onMounted(loadConfigs)
.sample-metrics span { .sample-metrics span {
padding: 6px 10px; padding: 6px 10px;
border-radius: 999px; border-radius: var(--radius-full);
background: #eef7f5; background: #eef7f5;
color: var(--accent-strong); color: var(--accent-strong);
font-size: 12px; font-size: var(--text-xs);
font-weight: 800; font-weight: 800;
} }
@@ -1265,7 +1265,7 @@ onMounted(loadConfigs)
gap: 12px; gap: 12px;
padding: 14px; padding: 14px;
border: 1px solid var(--panel-line); border: 1px solid var(--panel-line);
border-radius: 8px; border-radius: var(--radius-sm);
background: linear-gradient(180deg, #f8fafc, #ffffff); background: linear-gradient(180deg, #f8fafc, #ffffff);
} }
@@ -1325,7 +1325,7 @@ onMounted(loadConfigs)
gap: 14px; gap: 14px;
padding: 14px; padding: 14px;
border: 1px solid var(--panel-line); border: 1px solid var(--panel-line);
border-radius: 8px; border-radius: var(--radius-sm);
background: #fff; background: #fff;
} }
@@ -1359,7 +1359,7 @@ onMounted(loadConfigs)
display: block; display: block;
overflow: hidden; overflow: hidden;
color: var(--panel-ink); color: var(--panel-ink);
font-size: 14px; font-size: var(--text-base);
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
@@ -1371,7 +1371,7 @@ onMounted(loadConfigs)
margin-top: 4px; margin-top: 4px;
overflow: hidden; overflow: hidden;
color: var(--panel-muted); color: var(--panel-muted);
font-size: 12px; font-size: var(--text-xs);
line-height: 1.45; line-height: 1.45;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
@@ -1381,10 +1381,10 @@ onMounted(loadConfigs)
display: inline-flex; display: inline-flex;
justify-content: center; justify-content: center;
padding: 8px 10px; padding: 8px 10px;
border-radius: 8px; border-radius: var(--radius-sm);
background: #eaf7f0; background: #eaf7f0;
color: #067647; color: #067647;
font-size: 13px; font-size: var(--text-sm);
font-weight: 800; font-weight: 800;
} }
@@ -1401,7 +1401,7 @@ onMounted(loadConfigs)
.filter-chip, .filter-chip,
.collapse-button { .collapse-button {
border: 1px solid var(--panel-border); border: 1px solid var(--panel-border);
border-radius: 8px; border-radius: var(--radius-sm);
background: #fff; background: #fff;
color: var(--panel-ink); color: var(--panel-ink);
cursor: pointer; cursor: pointer;
@@ -1414,13 +1414,13 @@ onMounted(loadConfigs)
gap: 8px; gap: 8px;
min-height: 34px; min-height: 34px;
padding: 0 11px; padding: 0 11px;
font-size: 13px; font-size: var(--text-sm);
font-weight: 800; font-weight: 800;
} }
.filter-chip strong { .filter-chip strong {
color: var(--panel-muted); color: var(--panel-muted);
font-size: 12px; font-size: var(--text-xs);
} }
.filter-chip--active { .filter-chip--active {
@@ -1435,7 +1435,7 @@ onMounted(loadConfigs)
.rule-card { .rule-card {
overflow: hidden; overflow: hidden;
border-radius: 8px; border-radius: var(--radius-sm);
} }
.rule-card[data-invalid='true'] { .rule-card[data-invalid='true'] {
@@ -1468,10 +1468,10 @@ onMounted(loadConfigs)
width: 34px; width: 34px;
height: 34px; height: 34px;
place-items: center; place-items: center;
border-radius: 8px; border-radius: var(--radius-sm);
background: #182230; background: #182230;
color: #fff; color: #fff;
font-size: 13px; font-size: var(--text-sm);
font-weight: 900; font-weight: 900;
} }
@@ -1492,8 +1492,8 @@ onMounted(loadConfigs)
min-height: 28px; min-height: 28px;
padding: 0 9px; padding: 0 9px;
overflow: hidden; overflow: hidden;
border-radius: 999px; border-radius: var(--radius-full);
font-size: 12px; font-size: var(--text-xs);
font-weight: 800; font-weight: 800;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
@@ -1524,7 +1524,7 @@ onMounted(loadConfigs)
min-height: 28px; min-height: 28px;
padding: 0 9px; padding: 0 9px;
color: var(--accent-strong); color: var(--accent-strong);
font-size: 12px; font-size: var(--text-xs);
font-weight: 800; font-weight: 800;
} }
@@ -1540,7 +1540,7 @@ onMounted(loadConfigs)
gap: 12px; gap: 12px;
padding: 14px; padding: 14px;
border: 1px solid var(--panel-line); border: 1px solid var(--panel-line);
border-radius: 8px; border-radius: var(--radius-sm);
background: #fbfcfe; background: #fbfcfe;
} }
@@ -1563,13 +1563,13 @@ onMounted(loadConfigs)
min-height: 72px; min-height: 72px;
padding: 11px; padding: 11px;
border: 1px solid var(--panel-line); border: 1px solid var(--panel-line);
border-radius: 8px; border-radius: var(--radius-sm);
background: #fff; background: #fff;
} }
.switch-tile > span { .switch-tile > span {
color: #344054; color: #344054;
font-size: 12px; font-size: var(--text-xs);
font-weight: 800; font-weight: 800;
} }
@@ -1582,7 +1582,7 @@ onMounted(loadConfigs)
.message-box, .message-box,
.loading-band { .loading-band {
padding: 14px 16px; padding: 14px 16px;
border-radius: 8px; border-radius: var(--radius-sm);
color: var(--panel-muted); color: var(--panel-muted);
} }
@@ -1617,7 +1617,7 @@ onMounted(loadConfigs)
.admin-panel :deep(.el-button) { .admin-panel :deep(.el-button) {
min-height: 34px; min-height: 34px;
border-radius: 8px; border-radius: var(--radius-sm);
font-weight: 800; font-weight: 800;
} }
@@ -1632,7 +1632,7 @@ onMounted(loadConfigs)
.admin-panel :deep(.el-textarea__inner), .admin-panel :deep(.el-textarea__inner),
.admin-panel :deep(.el-select__wrapper) { .admin-panel :deep(.el-select__wrapper) {
min-height: 36px; min-height: 36px;
border-radius: 8px; border-radius: var(--radius-sm);
background: #fff; background: #fff;
box-shadow: 0 0 0 1px var(--panel-line) inset; box-shadow: 0 0 0 1px var(--panel-line) inset;
} }
@@ -1666,7 +1666,7 @@ onMounted(loadConfigs)
background-color: var(--accent); background-color: var(--accent);
} }
@media (max-width: 1280px) { @media (max-width: 1200px) {
.lookup-grid { .lookup-grid {
grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-columns: repeat(4, minmax(0, 1fr));
} }
@@ -1680,7 +1680,7 @@ onMounted(loadConfigs)
} }
} }
@media (max-width: 980px) { @media (max-width: 900px) {
.hero-main, .hero-main,
.section-heading, .section-heading,
.rules-heading, .rules-heading,
@@ -1787,10 +1787,10 @@ onMounted(loadConfigs)
align-items: center; align-items: center;
min-height: 30px; min-height: 30px;
padding: 0 12px; padding: 0 12px;
border-radius: 999px; border-radius: var(--radius-full);
background: rgba(15, 93, 216, 0.08); background: rgba(15, 93, 216, 0.08);
color: #175cd3; color: #175cd3;
font-size: 12px; font-size: var(--text-xs);
font-weight: 700; font-weight: 700;
} }
@@ -1832,7 +1832,7 @@ onMounted(loadConfigs)
.overview-label { .overview-label {
color: #64748b; color: #64748b;
font-size: 12px; font-size: var(--text-xs);
} }
.overview-file code { .overview-file code {
@@ -1863,12 +1863,12 @@ onMounted(loadConfigs)
.overview-stat span { .overview-stat span {
color: #64748b; color: #64748b;
font-size: 12px; font-size: var(--text-xs);
} }
.overview-stat strong { .overview-stat strong {
color: #1d3555; color: #1d3555;
font-size: 24px; font-size: var(--text-2xl);
line-height: 1; line-height: 1;
} }
@@ -1901,7 +1901,7 @@ onMounted(loadConfigs)
.field-block span { .field-block span {
color: #1d3555; color: #1d3555;
font-size: 12px; font-size: var(--text-xs);
font-weight: 700; font-weight: 700;
} }
@@ -1945,7 +1945,7 @@ onMounted(loadConfigs)
.toolbar-hint, .toolbar-hint,
.cell-subtle { .cell-subtle {
color: #64748b; color: #64748b;
font-size: 12px; font-size: var(--text-xs);
line-height: 1.45; line-height: 1.45;
} }
@@ -1966,7 +1966,7 @@ onMounted(loadConfigs)
border-radius: 14px; border-radius: 14px;
background: #fff5f4; background: #fff5f4;
border: 1px solid rgba(180, 35, 24, 0.14); border: 1px solid rgba(180, 35, 24, 0.14);
font-size: 13px; font-size: var(--text-sm);
} }
.data-table { .data-table {
@@ -1985,7 +1985,7 @@ onMounted(loadConfigs)
.data-table th { .data-table th {
color: #64748b; color: #64748b;
font-size: 12px; font-size: var(--text-xs);
font-weight: 700; font-weight: 700;
} }
@@ -2041,17 +2041,17 @@ onMounted(loadConfigs)
.binding-subtle { .binding-subtle {
color: #64748b; color: #64748b;
font-size: 13px; font-size: var(--text-sm);
} }
.binding-status-chip { .binding-status-chip {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
border-radius: 999px; border-radius: var(--radius-full);
padding: 2px 10px; padding: 2px 10px;
background: #fff1f2; background: #fff1f2;
color: #be123c; color: #be123c;
font-size: 12px; font-size: var(--text-xs);
font-weight: 700; font-weight: 700;
} }
@@ -2064,7 +2064,7 @@ onMounted(loadConfigs)
border: 1px solid rgba(86, 108, 138, 0.18); border: 1px solid rgba(86, 108, 138, 0.18);
background: rgba(255, 255, 255, 0.96); background: rgba(255, 255, 255, 0.96);
color: #1d3555; color: #1d3555;
border-radius: 999px; border-radius: var(--radius-full);
padding: 7px 12px; padding: 7px 12px;
cursor: pointer; cursor: pointer;
} }
@@ -2076,7 +2076,7 @@ onMounted(loadConfigs)
border-radius: 14px; border-radius: 14px;
background: rgba(255, 255, 255, 0.78); background: rgba(255, 255, 255, 0.78);
color: #64748b; color: #64748b;
font-size: 12px; font-size: var(--text-xs);
} }
.binding-grid { .binding-grid {
@@ -2124,7 +2124,7 @@ onMounted(loadConfigs)
.mapping-panel-head span { .mapping-panel-head span {
color: #64748b; color: #64748b;
font-size: 12px; font-size: var(--text-xs);
} }
.mapping-grid, .mapping-grid,
@@ -2138,7 +2138,7 @@ onMounted(loadConfigs)
display: grid; display: grid;
place-items: center; place-items: center;
color: #175cd3; color: #175cd3;
font-size: 12px; font-size: var(--text-xs);
font-weight: 700; font-weight: 700;
} }
@@ -2149,7 +2149,7 @@ onMounted(loadConfigs)
min-height: 30px; min-height: 30px;
min-width: 54px; min-width: 54px;
padding: 0 10px; padding: 0 10px;
border-radius: 999px; border-radius: var(--radius-full);
background: rgba(15, 93, 216, 0.08); background: rgba(15, 93, 216, 0.08);
border: 1px solid rgba(15, 93, 216, 0.14); border: 1px solid rgba(15, 93, 216, 0.14);
} }
@@ -2165,7 +2165,7 @@ onMounted(loadConfigs)
align-items: center; align-items: center;
gap: 8px; gap: 8px;
color: #1d3555; color: #1d3555;
font-size: 13px; font-size: var(--text-sm);
} }
.binding-actions { .binding-actions {
@@ -2175,7 +2175,7 @@ onMounted(loadConfigs)
.admin-panel :deep(.el-button) { .admin-panel :deep(.el-button) {
min-height: 34px; min-height: 34px;
border-radius: 999px; border-radius: var(--radius-full);
} }
.admin-panel :deep(.el-button--primary) { .admin-panel :deep(.el-button--primary) {
@@ -2185,7 +2185,7 @@ onMounted(loadConfigs)
--el-button-hover-border-color: #0f5dd8; --el-button-hover-border-color: #0f5dd8;
} }
@media (max-width: 1100px) { @media (max-width: 900px) {
.overview-stats, .overview-stats,
.lookup-toolbar, .lookup-toolbar,
.binding-grid, .binding-grid,
@@ -2202,7 +2202,7 @@ onMounted(loadConfigs)
} }
} }
@media (max-width: 720px) { @media (max-width: 640px) {
.panel-header, .panel-header,
.section-title-row, .section-title-row,
.section-header-tools, .section-header-tools,
apps/frontend/src/views/admin/AdminWebhookEventsView.vue
+1 -1
View File
@@ -409,7 +409,7 @@ onMounted(loadEvents)
gap: 6px; gap: 6px;
min-width: 0; min-width: 0;
padding: 10px 11px; padding: 10px 11px;
border-radius: 12px; border-radius: var(--radius-md);
background: rgba(255, 255, 255, 0.78); background: rgba(255, 255, 255, 0.78);
border: 1px solid var(--border-default); border: 1px solid var(--border-default);
} }