fix(rtime): split pool and weaving as interactive 50/50 on mobile

Replace scrollable stacked layout with flex: 1 split so both
visualizations are visible and interactive simultaneously without
scrolling. Sidebar capped at 80px to save vertical space.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Jeff Emmett 2026-04-13 15:51:47 +00:00
parent 18a688bade
commit 93d75aba81
1 changed files with 6 additions and 8 deletions

View File

@ -4258,28 +4258,26 @@ const CSS_TEXT = `
.exec-step-checklist input[type="checkbox"] { accent-color: #8b5cf6; }
@media (max-width: 768px) {
.main { overflow: visible; }
#canvas-view { flex-direction: column; overflow-y: auto; position: relative; height: auto; min-height: 100%; }
#canvas-view { flex-direction: column; }
.pool-panel {
width: 100% !important; min-width: unset;
border-right: none; border-bottom: 1px solid #334155;
min-height: 50vh; max-height: none; flex-shrink: 0;
flex: 1; min-height: 0; max-height: none;
}
.pool-panel.collapsed { min-height: 36px; max-height: 36px; }
.pool-panel.collapsed { flex: 0 0 36px; min-height: 36px; max-height: 36px; }
.canvas-wrap {
min-height: 60vh; flex-shrink: 0;
flex: 1; min-height: 0;
border-top: 1px solid #334155;
}
.canvas-wrap-header { display: flex; }
.panel-divider { display: none !important; }
.pool-hint { display: none; }
.pool-panel-sidebar { max-height: 80px; }
.exec-panel { width: 95vw; }
.task-edit-panel { width: 95vw; }
}
@media (max-width: 640px) {
.pool-panel { min-height: 45vh; }
.pool-panel.collapsed { width: 100% !important; min-height: 36px; max-height: 36px; }
.canvas-wrap { min-height: 55vh; }
.pool-panel.collapsed { width: 100% !important; }
}
`;