taiyi/dingdanquanliucheng
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 修复配置管理页面 textarea 和 switch 布局问题

Browse Source 
添加 .full-width grid-column 跨列、textarea 宽度撑满、合并重复规则。

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
taiyi 2026-06-05 20:49:07 +08:00
parent 2ef7624772
commit e4714d80f1
1 changed files with 1 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/web-admin/src/views/ConfigPage.vue
View File

@ -199,5 +199,5 @@ onMounted(reloadConfig);
</script>
<style scoped>
.page{padding:0;display:grid;gap:16px}.page-header{display:flex;justify-content:space-between;gap:12px;align-items:center}.subline{margin:0;color:#64748b}.toggle{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:#eff6ff;color:#1d4ed8;font-size:12px;font-weight:600}.validation-banner{display:flex;justify-content:space-between;gap:12px;padding:16px;border:1px solid #dbe3ef;border-radius:18px;background:#eff6ff}.validation-banner p{margin:6px 0 0;color:#475569}.banner-metrics{display:grid;grid-template-columns:repeat(3,minmax(100px,1fr));gap:10px}.banner-metrics article{padding:10px;border-radius:12px;background:#fff;border:1px solid #dbe3ef}.banner-metrics span{display:block;color:#64748b;font-size:12px}.banner-metrics strong{font-size:20px}.summary-grid,.group-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}.summary-card,.panel,.config-card,.group-card,.validation-card{border:1px solid #dbe3ef;border-radius:18px;padding:16px;background:#fff}.summary-card span{display:block;color:#64748b;margin-bottom:8px}.summary-card strong{font-size:24px}.panel-header{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:12px}.config-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}.config-card{display:grid;gap:10px}.config-card-top{display:flex;justify-content:space-between;gap:12px;align-items:center}.config-card p,.group-card p,.validation-card p{margin:0;color:#475569;line-height:1.6}.input-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.input-grid label{display:grid;gap:6px}.input-grid span{color:#475569;font-size:13px;font-weight:600}.action-row{display:flex;justify-content:flex-end;gap:10px;margin-top:14px}.action-row.left{justify-content:flex-start;flex-wrap:wrap}.primary-btn,.ghost-btn,input{border-radius:12px;border:1px solid #cbd5e1;padding:10px 12px;background:#fff}.primary-btn{background:#2563eb;color:#fff;border-color:#2563eb}.ghost-btn{background:#f8fafc;color:#334155}.group-card h4{margin:0 0 8px}.validation-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}.status-pill{display:inline-flex;margin-top:10px;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:600}.status-pill.done{background:#dcfce7;color:#166534}.status-pill.todo{background:#fef3c7;color:#92400e}.switch-group{display:grid;gap:6px}.switch-label{color:#475569;font-size:13px;font-weight:600}.switch-options{display:flex;gap:8px}.switch-options label{padding:8px 14px;border-radius:10px;border:1px solid #cbd5e1;cursor:pointer;font-size:13px;transition:all .15s}.switch-options label.selected{background:#eff6ff;border-color:#2563eb;color:#1d4ed8;font-weight:600}.switch-options input[type="radio"]{display:none}.panel-note{margin:0 0 12px;color:#64748b;font-size:13px}textarea{border-radius:12px;border:1px solid #cbd5e1;padding:10px 12px;background:#fff;resize:vertical;font-family:monospace;font-size:13px;min-height:60px}@media (max-width: 780px){.page-header,.validation-banner,.config-card-top{flex-direction:column;align-items:flex-start}.banner-metrics{grid-template-columns:1fr 1fr}.input-grid{grid-template-columns:1fr}}
.page{padding:0;display:grid;gap:16px}.page-header{display:flex;justify-content:space-between;gap:12px;align-items:center}.subline{margin:0;color:#64748b}.toggle{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:#eff6ff;color:#1d4ed8;font-size:12px;font-weight:600}.validation-banner{display:flex;justify-content:space-between;gap:12px;padding:16px;border:1px solid #dbe3ef;border-radius:18px;background:#eff6ff}.validation-banner p{margin:6px 0 0;color:#475569}.banner-metrics{display:grid;grid-template-columns:repeat(3,minmax(100px,1fr));gap:10px}.banner-metrics article{padding:10px;border-radius:12px;background:#fff;border:1px solid #dbe3ef}.banner-metrics span{display:block;color:#64748b;font-size:12px}.banner-metrics strong{font-size:20px}.summary-grid,.group-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}.summary-card,.panel,.config-card,.group-card,.validation-card{border:1px solid #dbe3ef;border-radius:18px;padding:16px;background:#fff}.summary-card span{display:block;color:#64748b;margin-bottom:8px}.summary-card strong{font-size:24px}.panel-header{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:12px}.config-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}.config-card{display:grid;gap:10px}.config-card-top{display:flex;justify-content:space-between;gap:12px;align-items:center}.config-card p,.group-card p,.validation-card p{margin:0;color:#475569;line-height:1.6}.input-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.input-grid label{display:grid;gap:6px}.input-grid span{color:#475569;font-size:13px;font-weight:600}.input-grid .full-width{grid-column:1/-1}.action-row{display:flex;justify-content:flex-end;gap:10px;margin-top:14px}.action-row.left{justify-content:flex-start;flex-wrap:wrap}.primary-btn,.ghost-btn,input{border-radius:12px;border:1px solid #cbd5e1;padding:10px 12px;background:#fff}.primary-btn{background:#2563eb;color:#fff;border-color:#2563eb}.ghost-btn{background:#f8fafc;color:#334155}.group-card h4{margin:0 0 8px}.validation-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}.status-pill{display:inline-flex;margin-top:10px;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:600}.status-pill.done{background:#dcfce7;color:#166534}.status-pill.todo{background:#fef3c7;color:#92400e}.switch-group{display:grid;gap:6px}.switch-label{color:#475569;font-size:13px;font-weight:600}.switch-options{display:flex;gap:8px}.switch-options label{padding:8px 14px;border-radius:10px;border:1px solid #cbd5e1;cursor:pointer;font-size:13px;transition:all .15s}.switch-options label.selected{background:#eff6ff;border-color:#2563eb;color:#1d4ed8;font-weight:600}.switch-options input[type="radio"]{display:none}.panel-note{margin:0 0 12px;color:#64748b;font-size:13px}textarea{width:100%;box-sizing:border-box;border-radius:12px;border:1px solid #cbd5e1;padding:10px 12px;background:#fff;resize:vertical;font-family:monospace;font-size:13px;min-height:60px}@media (max-width: 780px){.page-header,.validation-banner,.config-card-top{flex-direction:column;align-items:flex-start}.banner-metrics{grid-template-columns:1fr 1fr}.input-grid{grid-template-columns:1fr}}
</style>