diff --git a/frontend/styles.css b/frontend/styles.css index 4178490..872a0b0 100644 --- a/frontend/styles.css +++ b/frontend/styles.css @@ -725,30 +725,93 @@ kbd { @media (max-width: 1300px) { .workspace { - height: auto; grid-template-columns: 1fr; - grid-template-rows: auto auto auto; + grid-template-rows: minmax(420px, 1fr) repeat(2, minmax(240px, auto)); + grid-auto-flow: row; + gap: 12px; + height: auto; } .pane.center { - min-height: 600px; + order: -1; + min-height: 420px; + max-height: 58vh; + } + + .pane.left, + .pane.right { + max-height: 320px; + overflow: hidden; + } + + .pane.left .list, + .pane.right .miniList { + max-height: 160px; + } + + .canvasViewport { + height: min(54vh, 520px); } } @media (max-width: 820px) { .topbar { position: static; + flex-direction: column; + align-items: flex-start; + gap: 6px; } .brand h1 { font-size: 1.3rem; } + .brand { + width: 100%; + } + .actions { + width: 100%; justify-content: flex-start; + flex-wrap: nowrap; + overflow-x: auto; + padding-bottom: 4px; + scrollbar-width: thin; + } + + .actions button, + .actions select { + flex: 0 0 auto; + } + + .actions::-webkit-scrollbar { + height: 6px; + } + + .actions::-webkit-scrollbar-thumb { + background: var(--line-strong); + border-radius: 999px; + } + + .workspace { + padding: 6px; } .editorGrid { grid-template-columns: 1fr; } + + .jsonActions { + flex-direction: column; + gap: 4px; + } + + .jsonActions button { + width: 100%; + } + + .pane.left, + .pane.right { + max-height: 300px; + } } diff --git a/src/layout.js b/src/layout.js index ce1f83a..4fab98e 100644 --- a/src/layout.js +++ b/src/layout.js @@ -2204,10 +2204,12 @@ function shouldUseLabelTie(net, pinNodes, context) { if (!pinNodes.length) { return false; } - const minX = Math.min(...pinNodes.map((p) => p.exit.x), 0); - const maxX = Math.max(...pinNodes.map((p) => p.exit.x), 0); - const minY = Math.min(...pinNodes.map((p) => p.exit.y), 0); - const maxY = Math.max(...pinNodes.map((p) => p.exit.y), 0); + const xs = pinNodes.map((p) => p.exit.x); + const ys = pinNodes.map((p) => p.exit.y); + const minX = Math.min(...xs); + const maxX = Math.max(...xs); + const minY = Math.min(...ys); + const maxY = Math.max(...ys); const span = Math.abs(maxX - minX) + Math.abs(maxY - minY); if (context.renderMode === "explicit") { @@ -2248,11 +2250,20 @@ function shouldFallbackToTieByQuality(net, pinNodes, routed) { const totalLength = Number(stats.total_length ?? 0); const directLength = Number(stats.direct_length ?? totalLength); const spanRatio = directLength > 0 ? totalLength / directLength : 1; + const xs = pinNodes.map((p) => p.exit.x); + const ys = pinNodes.map((p) => p.exit.y); + const span = Math.abs(Math.max(...xs) - Math.min(...xs)) + Math.abs(Math.max(...ys) - Math.min(...ys)); + const hasSpread = span >= GRID * 24; - if (pinNodes.length >= 4 && (detour > 2.25 || bends >= 7)) { + if (pinNodes.length >= 4 && hasSpread && (detour > 2.25 || bends >= 7)) { return true; } - if ((net.class === "analog" || net.class === "signal") && pinNodes.length >= 3 && spanRatio > 2.7) { + if ( + hasSpread && + (net.class === "analog" || net.class === "signal") && + pinNodes.length >= 3 && + spanRatio > 2.7 + ) { return true; } return false; diff --git a/tests/baselines/ui/dense-analog.png b/tests/baselines/ui/dense-analog.png index 425e6ae..7231d91 100644 Binary files a/tests/baselines/ui/dense-analog.png and b/tests/baselines/ui/dense-analog.png differ diff --git a/tests/baselines/ui/explicit-mode-auto-tidy.png b/tests/baselines/ui/explicit-mode-auto-tidy.png index 5e2c98b..14e3b91 100644 Binary files a/tests/baselines/ui/explicit-mode-auto-tidy.png and b/tests/baselines/ui/explicit-mode-auto-tidy.png differ diff --git a/tests/baselines/ui/laptop-viewport.png b/tests/baselines/ui/laptop-viewport.png index 928457b..43253f2 100644 Binary files a/tests/baselines/ui/laptop-viewport.png and b/tests/baselines/ui/laptop-viewport.png differ