fix: 移动端合并改为底部标签直接并入右侧栏(迁移式,删除双工作台堆叠方案)+ 窄屏断点收紧至 768px(不对齐宿主 1024)

This commit is contained in:
Menghuan1918
2026-08-12 18:27:28 +08:00
parent b391ebffed
commit ffc2270d77
10 changed files with 196 additions and 305 deletions
+7 -39
View File
@@ -264,38 +264,6 @@
display: flex;
}
/* The narrow-viewport workbench (MobileWorkbench): BOTH workbench trees
stacked in the one drawer — the right panel's tree flexes after the
fixed-height bottom tree, with a draggable divider (the .dividerCol
hit-strip + hairline) between them. */
.mobileWorkbench {
flex: 1;
min-width: 0;
min-height: 0;
display: flex;
flex-direction: column;
}
.mobilePane {
position: relative;
display: flex;
min-width: 0;
min-height: 0;
}
/* The bottom tree of the merged layout: fixed height (state.bottomHeight),
flex: none so the top tree takes the remainder. */
.mobilePaneBottom {
flex: none;
}
/* The divider of the merged layout sits between the two panes; .dividerCol
already supplies the 7px hit strip, row-resize cursor and hairline. */
.mobileWorkbench > .dividerCol {
flex: none;
margin: 0;
}
.split {
flex: 1;
min-width: 0;
@@ -1899,13 +1867,13 @@
/* ── Narrow (mobile) viewport ──────────────────────────────────────────── */
/* Pairs with NARROW_MAX_WIDTH = 1024 in src/client/breakpoints.ts: widths
strictly below 1024px (i.e. max-width: 1023px) switch the sidebar to the
mobile layout — one drawer holding both workbenches, one toggle button.
The structural switches (which panels render, the merged MobileWorkbench)
are JS-driven via useNarrowViewport; this block only adapts the pure
style details. */
@media (max-width: 1023px) {
/* Pairs with NARROW_MAX_WIDTH = 768 in src/client/breakpoints.ts: widths
strictly below 768px (i.e. max-width: 767px) switch the sidebar to the
mobile layout — one full-screen drawer (the bottom panel's tabs were
migrated into the right tree), one toggle button. The structural
switches (which panels render, the migration) are JS-driven via
useNarrowViewport; this block only adapts the pure style details. */
@media (max-width: 767px) {
/* The toggle cluster holds a single button on narrow viewports (the
bottom panel button is not rendered), so the open panel's tab strip
reserves 40px instead of the desktop 72px — the tabs and + menu still