From c02602dcc067e963b1b6a0c4d82a35357b9d64f6 Mon Sep 17 00:00:00 2001 From: umsangdon Date: Tue, 13 Oct 2026 13:48:46 +0900 Subject: [PATCH] =?UTF-8?q?fix(device):=20=ED=9C=B4=EB=8C=80=ED=8F=B0=20?= =?UTF-8?q?=ED=8F=AD=20=EB=82=A8=EC=9D=80=20=EB=84=98=EC=B9=A8=20=E2=80=94?= =?UTF-8?q?=20B06=20=ED=9A=A1=EB=8B=A8=20=EC=B9=B4=EB=93=9C=20=ED=95=9C=20?= =?UTF-8?q?=EC=9E=A5=EC=94=A9=20=C2=B7=20B05=203D=20=EB=B3=B4=EA=B8=B0=20?= =?UTF-8?q?=EB=8B=A8=EC=B6=94=20=EC=A4=84=EB=B0=94=EA=BF=88=20=C2=B7=20?= =?UTF-8?q?=EC=A0=91=ED=9E=8C=20=EC=84=9C=EB=9E=8D=20=EB=82=B4=EC=9A=A9=20?= =?UTF-8?q?=EC=88=A8=EA=B9=80=20=C2=B7=20=ED=84=B0=EC=B9=98=20=EC=86=90?= =?UTF-8?q?=EC=9E=A1=EC=9D=B4=20=ED=99=94=EB=A9=B4=20=EC=95=88=20=C2=B7=20?= =?UTF-8?q?=EC=9E=AC=EA=B8=B0=20=E3=80=8C=EB=84=93=EC=9D=80=20=EC=83=81?= =?UTF-8?q?=EC=9E=90=E3=80=8D=20=3D=20=EC=96=B4=EB=8A=90=20=EC=A1=B0?= =?UTF-8?q?=EC=83=81=EC=9D=B4=EB=93=A0=20=EA=B0=80=EB=A1=9C=20=EB=B0=80?= =?UTF-8?q?=EA=B8=B0=EB=A9=B4=20=EB=8B=BF=EC=9D=8C=20(=EA=B8=B0=EA=B8=B0?= =?UTF-8?q?=EB=8C=80=EC=9D=91=205)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-Authored-By: Claude Opus 5.5 Claude-Session: https://claude.ai/code/session_01Ji4nuyLVHcxrXWHTdb5nRD --- A00_Common/device_context.css | 2 +- B05_Profile/B05_Profile_UI_Style.css | 10 ++++++++++ B06_Section/B06_Section_UI_Section_View.ts | 10 ++++++---- resources/tester/test_173_areas_detail.py | 2 +- resources/tester/test_device_audit.py | 2 +- ui_template/ui_template_overlay.css | 7 +++++++ 6 files changed, 26 insertions(+), 7 deletions(-) diff --git a/A00_Common/device_context.css b/A00_Common/device_context.css index cb33787e3..f5a52403f 100644 --- a/A00_Common/device_context.css +++ b/A00_Common/device_context.css @@ -35,7 +35,7 @@ html[data-touch="on"] .ui-checkbox { /* 좌측 패널 손잡이 — 손가락 폭 */ html[data-touch="on"] .ui-workflow-overlay__handle--side { width: 32px; - right: -31px; + right: -32px; } /* 팝업(2-4) — 폭 600 미만은 전체 화면 · 겹치면 나중 것(맨 위)만 보이고 × 로 앞 창. diff --git a/B05_Profile/B05_Profile_UI_Style.css b/B05_Profile/B05_Profile_UI_Style.css index 1a83939f5..712bcb7fa 100644 --- a/B05_Profile/B05_Profile_UI_Style.css +++ b/B05_Profile/B05_Profile_UI_Style.css @@ -603,3 +603,13 @@ font-size: var(--text-caption); font-style: normal; } + +/* 휴대폰 폭(기기대응) — 3D 보기 단추 줄이 화면 밖으로 안 나가게 줄바꿈 */ +html[data-size="compact"] .b05-route__view-controls { + right: var(--spacing-16); + flex-wrap: wrap; +} + +html[data-size="compact"] .b05-route__view-group { + flex-wrap: wrap; +} diff --git a/B06_Section/B06_Section_UI_Section_View.ts b/B06_Section/B06_Section_UI_Section_View.ts index 11ecf14a2..92a38767a 100644 --- a/B06_Section/B06_Section_UI_Section_View.ts +++ b/B06_Section/B06_Section_UI_Section_View.ts @@ -435,11 +435,13 @@ export function createSectionView( true, ); // 열 수 = 사용자 값 · 폭 = (칸 폭 − 간격) ÷ 열 수(`_Section_Columns` · 138-3). - cachedCardWidth = crossCardWidth(renderWidth, columnCount, CROSS_GRID_GAP); + // 휴대폰 폭(기기대응 · )은 한 장씩 — 카드가 반으로 눌려 단추 · 면적표가 잘림 + const cols = document.documentElement.dataset.size === "compact" ? 1 : columnCount; + cachedCardWidth = crossCardWidth(renderWidth, cols, CROSS_GRID_GAP); // CSS auto-fill의 자체 열 수와 JS columnCount가 어긋나면 같은 행 높이 그룹핑이 실제 // 렌더 행과 달라져 카드 내부가 뒤죽박죽된다(N-2-6). 열 수 · 폭을 JS가 명시해 일치시킨다. - grid.style.gridTemplateColumns = `repeat(${columnCount}, ${cachedCardWidth}px)`; - grid.dataset.columns = String(columnCount); // 4열부터 면적표 「계」만(173-3 · CSS) + grid.style.gridTemplateColumns = `repeat(${cols}, ${cachedCardWidth}px)`; + grid.dataset.columns = String(cols); // 4열부터 면적표 「계」만(173-3 · CSS) // 맹암거 형상 누름 = 그 구조물 id 고름(288-2 · 노면공 포장 범위 표식과 따로 · 같은 id 고름 창구) grid.addEventListener(SHAPE_PICK_EVENT, (event) => { const id = (event as CustomEvent).detail; @@ -460,7 +462,7 @@ export function createSectionView( baseHeightsOf(plotBases, cachedCardWidth, baseWidth), baseWidth, cachedCardWidth, - columnCount, + cols, ); sections.forEach((section, index) => { cachedRowHeight.set(section.station_id, rowHeights[index]); diff --git a/resources/tester/test_173_areas_detail.py b/resources/tester/test_173_areas_detail.py index a772fc015..f7a695ac6 100644 --- a/resources/tester/test_173_areas_detail.py +++ b/resources/tester/test_173_areas_detail.py @@ -69,7 +69,7 @@ def test_면적표_4열부터_계만_접기(): ) assert rule, "4~6열 EA · RR · BR 접기 규칙 없음" src = _read("B06_Section_UI_Section_View.ts") - assert "grid.dataset.columns = String(columnCount);" in src + assert "grid.dataset.columns = String(cols);" in src # 실제 그린 열 수(휴대폰 폭 = 1 · 기기대응) # ── 173-4 [상세] 그림 ──────────────────────────────────────── diff --git a/resources/tester/test_device_audit.py b/resources/tester/test_device_audit.py index 8e1660ef7..ff82c7994 100644 --- a/resources/tester/test_device_audit.py +++ b/resources/tester/test_device_audit.py @@ -113,7 +113,7 @@ AUDIT_JS = r""" // 본문 안 화면보다 넓은 상자(고정 폭) const outlet = document.getElementById('app-outlet'); if (outlet) for (const el of outlet.querySelectorAll('*')) { - if (el.offsetWidth > vw + 1 && !scrollable(el.parentElement || el, 'x')) out.too_wide++; + if (el.offsetWidth > vw + 1 && !reachable(el, 'x')) out.too_wide++; } out.pointer = matchMedia('(pointer: coarse)').matches ? 'coarse' : 'fine'; out.rendered = !!(outlet && outlet.childElementCount); diff --git a/ui_template/ui_template_overlay.css b/ui_template/ui_template_overlay.css index 9e033e8f2..8e0d91096 100644 --- a/ui_template/ui_template_overlay.css +++ b/ui_template/ui_template_overlay.css @@ -551,3 +551,10 @@ html:is([data-size="compact"], [data-size="medium"]) .ui-workflow-overlay__panel flex-direction: column; border-radius: var(--radius-cards) var(--radius-cards) 0 0; } + +/* 접힌 서랍 — 화면 밖 내용은 안 보이게(손가락 · 읽기 프로그램이 밖의 단추를 잡지 않음) · 손잡이만 남김 */ +html:is([data-size="compact"], [data-size="medium"]) + .ui-workflow-overlay__panel--title.is-collapsed + > :not(.ui-workflow-overlay__handle) { + visibility: hidden; +}