diff --git a/web/hwlab-cloud-web/scripts/check.ts b/web/hwlab-cloud-web/scripts/check.ts index 37ecc177..67cf78ca 100644 --- a/web/hwlab-cloud-web/scripts/check.ts +++ b/web/hwlab-cloud-web/scripts/check.ts @@ -86,8 +86,11 @@ assert.doesNotMatch(rightSidebar, /readonly-rpc|复核入口/iu, "right sidebar assert.doesNotMatch(rightSidebar, /data-hardware-tab|m3-control|hardware-list|wiring-body|records-list/iu, "right sidebar must not keep legacy hardware panels"); assert.match(rightSidebar, /class="summary-tile"[^>]*role="button"[^>]*tabindex="0"/u, "Pod summary is a click/keyboard summary tile"); assert.match(rightSidebar, /= 0 ? source.slice(match.index, bodyEnd + 1) : source.slice(match.index); } +function cssRules(source, selector) { + const pattern = new RegExp(`${escapeRegExp(selector)}\\s*\\{`, "gu"); + const rules = []; + for (const match of source.matchAll(pattern)) { + const bodyStart = match.index + match[0].length; + const bodyEnd = source.indexOf("}", bodyStart); + rules.push(bodyEnd >= 0 ? source.slice(match.index, bodyEnd + 1) : source.slice(match.index)); + } + return rules.join("\n"); +} + function functionBody(source, name) { const match = new RegExp(`function\\s+${escapeRegExp(name)}\\s*\\([^)]*\\)\\s*\\{`, "u").exec(source); if (!match) return ""; diff --git a/web/hwlab-cloud-web/styles.css b/web/hwlab-cloud-web/styles.css index 4b882eeb..e4c371b6 100644 --- a/web/hwlab-cloud-web/styles.css +++ b/web/hwlab-cloud-web/styles.css @@ -722,14 +722,14 @@ h3 { min-width: 0; display: grid; align-content: center; - gap: 4px; - padding: 10px 12px; + gap: 3px; + padding: 8px 10px; background: var(--surface-2); border-left: 4px solid var(--accent); } .probe-card strong { - font-size: 17px; + font-size: 15px; line-height: 1.2; text-transform: uppercase; overflow-wrap: anywhere; @@ -737,6 +737,11 @@ h3 { .probe-card small { color: var(--muted); + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; + line-height: 1.3; + overflow: hidden; overflow-wrap: anywhere; } @@ -744,8 +749,8 @@ h3 { position: relative; min-width: 0; max-width: 100%; - margin-top: 4px; - padding-top: 7px; + margin-top: 2px; + padding-top: 5px; border-top: 1px solid var(--line); } @@ -1797,13 +1802,14 @@ h3 { .right-sidebar { position: relative; display: grid; - grid-auto-rows: max-content; - gap: 8px; - padding: 10px 10px 10px 16px; + grid-template-rows: auto auto auto auto minmax(0, 1fr); + align-content: stretch; + gap: 6px; + padding: 8px 10px 8px 16px; background: rgba(18, 20, 18, 0.98); border-left: 1px solid var(--line); overflow-x: hidden; - overflow-y: auto; + overflow-y: hidden; overscroll-behavior: contain; scrollbar-gutter: stable; } @@ -1838,14 +1844,21 @@ h3 { min-width: 0; display: grid; gap: 4px; - padding: 10px 12px; + padding: 8px 10px; background: rgba(24, 27, 24, 0.76); border: 1px solid var(--line); } +.sidebar-workbench-header .route-path { + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; + overflow: hidden; +} + .sidebar-workbench-header h2 { font-size: 15px; - line-height: 1.2; + line-height: 1.15; } .workbench-shell.is-right-sidebar-collapsed .right-sidebar { @@ -2454,8 +2467,8 @@ tbody tr:last-child td { min-width: 0; min-height: 0; display: grid; - gap: 8px; - padding: 10px; + gap: 6px; + padding: 8px; overflow: visible; } @@ -2465,7 +2478,9 @@ tbody tr:last-child td { } .device-pod-workspace { - grid-template-rows: auto auto; + grid-template-rows: auto minmax(0, 1fr); + align-self: stretch; + overflow: hidden; } .device-pod-selector-row { @@ -2499,7 +2514,7 @@ tbody tr:last-child td { .device-pod-summary .summary-tile, .device-pod-interfaces .summary-tile { gap: 4px; - padding: 8px; + padding: 7px; } .device-pod-summary .kv-list { @@ -2520,7 +2535,7 @@ tbody tr:last-child td { min-width: 0; margin: 2px 0 0; color: var(--text); - font: 10px/1.2 var(--mono); + font: 9px/1.15 var(--mono); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; @@ -2567,11 +2582,12 @@ tbody tr:last-child td { .device-event-panel { min-width: 0; - min-height: 240px; + min-height: 0; display: grid; - grid-template-rows: auto minmax(180px, 1fr); + grid-template-rows: auto minmax(132px, 1fr); border: 1px solid var(--line); background: #101310; + overflow: hidden; } .event-toolbar { @@ -2580,7 +2596,7 @@ tbody tr:last-child td { grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px; align-items: center; - padding: 8px; + padding: 6px 8px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 11px; @@ -2605,10 +2621,10 @@ tbody tr:last-child td { .device-event-scroll { min-width: 0; - min-height: 132px; + min-height: 0; overflow: auto; overscroll-behavior: contain; - padding: 8px; + padding: 7px; } .device-event-scroll pre {