fix: 移动端合并改为底部标签直接并入右侧栏(迁移式,删除双工作台堆叠方案)+ 窄屏断点收紧至 768px(不对齐宿主 1024)
This commit is contained in:
@@ -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
|
||||
|
||||
Reference in New Issue
Block a user