style: 减小padding/gap 列宽140px 1fr 0.7fr 0.6fr

This commit is contained in:
qinglong
2026-06-14 13:40:17 +08:00
parent 1572e23fda
commit ae82b17b7b
+7 -7
View File
@@ -44,7 +44,7 @@
</div>
<style>
.node-card { background:var(--md-sys-color-surface-container); border-radius:var(--shape-sm); padding:16px; transition:box-shadow .3s, background .3s }
.node-card { background:var(--md-sys-color-surface-container); border-radius:var(--shape-sm); padding:12px; transition:box-shadow .3s, background .3s }
.node-card:hover { box-shadow:0 2px 8px rgba(0,0,0,.2) }
.node-card.online { border-left:3px solid var(--success, #4caf50) }
.node-card.offline { border-left:3px solid var(--error, #f44336); opacity:.7 }
@@ -55,14 +55,14 @@
.node-url { font-size:.75rem; color:var(--text-dim); margin-bottom:8px; word-break:break-all }
.node-notes { font-size:.75rem; color:var(--text-dim); font-style:italic; margin-bottom:8px }
/* 横版布局 — 左设备信息 | 右数据+图表同行 */
#sentinel-grid.layout-row { display:flex;flex-direction:column;gap:12px }
#sentinel-grid.layout-row .node-card { display:grid;grid-template-columns:140px 1fr auto auto 0.8fr 1fr;gap:12px 16px;align-items:start }
#sentinel-grid.layout-row { display:flex;flex-direction:column;gap:8px }
#sentinel-grid.layout-row .node-card { display:grid;grid-template-columns:140px 1fr 0.8fr 0.7fr 0.8fr 1fr;gap:12px 16px;align-items:start }
#sentinel-grid.layout-row .col-left { min-width:0 }
#sentinel-grid.layout-row .col-right-stack { display:flex;flex-direction:column;gap:12px;min-width:0 }
#sentinel-grid.layout-row .col-extra { display:flex;flex-direction:column;gap:6px;padding:0 8px;max-width:160px }
#sentinel-grid.layout-row .col-extra { display:flex;flex-direction:column;gap:4px;padding:0 2px }
#sentinel-grid.layout-row .extra-row { font-size:.8rem;padding:3px 0;border-bottom:1px solid var(--md-sys-color-surface-container-lowest) }
#sentinel-grid.layout-row .extra-row .elabel { font-size:.65rem;color:var(--text-dim);text-transform:uppercase;margin-right:4px }
#sentinel-grid.layout-row .col-disk { display:none;overflow-y:auto;max-height:200px;padding:0 4px;max-width:180px }
#sentinel-grid.layout-row .col-disk { display:none;overflow-y:auto;max-height:200px;padding:0 2px }
#sentinel-grid.layout-row .disk-list { display:flex;flex-direction:column;gap:4px }
#sentinel-grid.layout-row .part-row { display:flex;flex-direction:column;gap:2px;padding:3px 0;border-bottom:1px solid var(--md-sys-color-surface-container-lowest) }
#sentinel-grid.layout-row .part-info { display:flex;justify-content:space-between;font-size:.7rem }
@@ -82,10 +82,10 @@
#sentinel-grid.layout-row .part-bar-fill { height:100%;border-radius:1px;background:var(--primary) }
#sentinel-grid.layout-row .part-detail { display:flex;justify-content:space-between;font-size:.6rem;color:var(--text-dim) }
#sentinel-grid.layout-row .part-pct { text-align:right }
#sentinel-grid.layout-row .col-extra { display:flex;flex-direction:column;gap:6px;padding:0 8px;max-width:160px }
#sentinel-grid.layout-row .col-extra { display:flex;flex-direction:column;gap:4px;padding:0 2px }
#sentinel-grid.layout-row .extra-row { font-size:.8rem;padding:3px 0;border-bottom:1px solid var(--md-sys-color-surface-container-lowest) }
#sentinel-grid.layout-row .extra-row .elabel { font-size:.65rem;color:var(--text-dim);text-transform:uppercase;margin-right:4px }
#sentinel-grid.layout-row .col-disk { display:none;overflow-y:auto;max-height:200px;padding:0 4px;max-width:180px }
#sentinel-grid.layout-row .col-disk { display:none;overflow-y:auto;max-height:200px;padding:0 2px }
#sentinel-grid.layout-row .disk-list { display:flex;flex-direction:column;gap:4px }
#sentinel-grid.layout-row .part-row { display:flex;flex-direction:column;gap:2px;padding:3px 0;border-bottom:1px solid var(--md-sys-color-surface-container-lowest) }
#sentinel-grid.layout-row .part-info { display:flex;justify-content:space-between;font-size:.7rem }