feat(sw): viewer header keeps every menu down to 520px
Deploy Storybook / deploy (push) Successful in 1m16s
Deploy Storybook / deploy (push) Successful in 1m16s
- File name: clamp(80px, min(45cqw - 256px, 100cqw - 780px), 360px), 56px below 560px; 1280px and wider unchanged - Model / Layout tabs narrow (name, then count ellipsized) down to the new --hm-sw-viewer-tabs-min-width (48px) before anything moves into More; the measurement counts them at that minimum once every icon step applies - Switch items get an optional shortLabel shown below 560px (어두운 배경 -> 배경); counts hidden there - More appears only below about 520px; viewer test and AI guides updated
This commit is contained in:
1 parent
7976801034
commit
cabd2f67de
8 files changed
+83
-34
No files matched your search
@@ -70,15 +70,18 @@ export function useViewerDemo({ initialDocument = null as string | null, initial
|
||||
const groups = useMemo<SWViewerHeaderGroup[]>(() => [
|
||||
{
|
||||
id: "space", label: "도면 공간", surface: "field", hidden: !loaded, items: [
|
||||
// 2026-10-26 (user request): the tabs first narrow with an ellipsis (down to --hm-sw-viewer-tabs-min-width); only
|
||||
// a header too narrow even then (below about 520px) moves the collapseBelow items into More.
|
||||
{ type: "tabs", id: "space", label: "모델과 배치 선택", moreLabel: "도면 공간", collapseBelow: 1180, value: space, options: SPACES, onValueChange: setSpace },
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "view", label: "화면 보기", surface: "field", items: [
|
||||
// 2026-10-21: shown while the header has room, icon only next, then into More (measured, see SWViewerHeader).
|
||||
// 2026-10-26: into More only below about 520px (after the tabs narrowed); 어두운 배경 shows 배경 in a narrow header.
|
||||
{ type: "button", id: "fit", label: "전체 보기", icon: <Scan />, title: "전체 도면 맞춤 (F)", iconOnlyBelow: 560, collapseBelow: 1180, disabled: !loaded },
|
||||
{ type: "switch", id: "2.5d", label: "2.5D", checked: is25D, collapseBelow: 1180, onCheckedChange: set25D },
|
||||
{ type: "switch", id: "dark", label: "어두운 배경", checked: dark, collapseBelow: 1180, onCheckedChange: setDark },
|
||||
{ type: "switch", id: "dark", label: "어두운 배경", shortLabel: "배경", checked: dark, collapseBelow: 1180, onCheckedChange: setDark },
|
||||
],
|
||||
},
|
||||
{
|
||||
|
||||
Reference in new issue
Block a user