From 1dddb5185cd09d5294810cda5abf6b02b434997c Mon Sep 17 00:00:00 2001 From: umsangdon Date: Sun, 25 Oct 2026 14:44:46 +0900 Subject: [PATCH] =?UTF-8?q?fix(523-1):=20B07=20=EC=84=A4=EC=A0=95=20?= =?UTF-8?q?=EB=AA=A8=EB=8B=AC=20=EC=A2=81=EC=9D=80=20=ED=8F=AD=20=EB=A8=B8?= =?UTF-8?q?=EB=A6=AC=20=ED=95=9C=20=EC=A4=84=20=C2=B7=20=EB=8B=A8=EC=B6=94?= =?UTF-8?q?=20=EC=A4=84=20=ED=95=9C=20=EA=B7=9C=EA=B2=A9=20=C2=B7=20?= =?UTF-8?q?=EB=B0=96=EC=97=90=EC=84=9C=20=EB=88=84=EB=A5=B4=EA=B3=A0=20?= =?UTF-8?q?=EC=95=88=EC=97=90=EC=84=9C=20=EB=96=BC=EB=8F=84=20=EC=95=88=20?= =?UTF-8?q?=EB=8B=AB=ED=9E=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 공용 모달 바깥 닫기 = 뗌 자리도 배경일 때만(누름 바깥 · 뗌 안 = 안 닫힘) - 360 px 모달 제목 · [원본에서 다시 그리기] · [닫기] 줄바꿈 없앰 · 단추 줄 [안내선 숨기기]도 같은 키(32 px) Co-Authored-By: Claude Opus 5.5 --- .../B07_DesignDetail_UI_Style.css | 19 +++++++++++++++++++ ui_template/ui_template_modal.ts | 9 +++++---- 2 files changed, 24 insertions(+), 4 deletions(-) diff --git a/B07_DesignDetail/B07_DesignDetail_UI_Style.css b/B07_DesignDetail/B07_DesignDetail_UI_Style.css index 7a3585737..251ad8c83 100644 --- a/B07_DesignDetail/B07_DesignDetail_UI_Style.css +++ b/B07_DesignDetail/B07_DesignDetail_UI_Style.css @@ -500,6 +500,17 @@ html.is-bm-route .b07-cad-stack > .cad-tabs { width: min(360px, 92vw); } +/* 좁은 폭 — 제목 · 머리 단추 한 줄(줄바꿈 없음) */ +.ui-modal.b07-settings .ui-modal__top > h3 { + font-size: 16px; + white-space: nowrap; +} + +.ui-modal.b07-settings .ui-modal__top .ui-btn { + padding-inline: var(--spacing-8); + white-space: nowrap; +} + .b07-settings__note { margin: 0; color: var(--color-text-secondary); @@ -536,6 +547,14 @@ html.is-bm-route .b07-cad-stack > .cad-tabs { margin-left: auto; } +/* 단추 줄 한 규격 — 안내선 단추(좌측 패널 작은 꼴)도 같은 키 · 좁은 폭에 맞춘 옆 여백 */ +.b07-settings__actions .ui-btn { + padding: var(--spacing-8) var(--spacing-12); + font-size: var(--text-body-sm); + border-radius: var(--radius-buttons); + white-space: nowrap; +} + /* ⚙ 축척 칸(485-2) — X · Y(· 평면도) 칸 한 줄 */ .b07-scale { display: flex; diff --git a/ui_template/ui_template_modal.ts b/ui_template/ui_template_modal.ts index 083b4d5e8..a74de124d 100644 --- a/ui_template/ui_template_modal.ts +++ b/ui_template/ui_template_modal.ts @@ -50,10 +50,11 @@ export function openModal(opts: ModalOptions): { close: () => void } { className: `ui-modal__backdrop ${opts.backdropClass ?? ""}`.trim(), children: [dialog], }); - // 바깥 누르기 = 누름 · 뗌 둘 다 바깥일 때만 — 칸 안에서 끌어 바깥에서 떼면 안 닫음 - let downOutside = false; - backdrop.addEventListener("pointerdown", (ev) => (downOutside = ev.target === backdrop)); - backdrop.addEventListener("click", (ev) => ev.target === backdrop && downOutside && void ask()); + // 바깥 누르기 = 누름 · 뗌 둘 다 바깥일 때만 — 칸 안에서 끌어 바깥에서 떼면(그 반대도) 안 닫음 + let outside = false; + backdrop.addEventListener("pointerdown", (ev) => (outside = ev.target === backdrop)); + backdrop.addEventListener("pointerup", (ev) => (outside &&= ev.target === backdrop)); + backdrop.addEventListener("click", (ev) => ev.target === backdrop && outside && void ask()); backdrop.addEventListener("keydown", (ev) => ev.key === "Escape" && void ask()); opts.mount(body, close, actions); // 단추가 있을 때만 머리에 — [닫기] 는 머리 직속 그대로(B05 추천의 `.ui-modal__top > button` 갈아 끼우기)