From 4ee2a4b74b61c07df7ae411d7b4b45e91474ea02 Mon Sep 17 00:00:00 2001 From: umsangdon Date: Mon, 5 Oct 2026 12:47:31 +0900 Subject: [PATCH] =?UTF-8?q?fix(M02):=2045-5=20=EA=B5=AC=EC=A1=B0=EB=AC=BC?= =?UTF-8?q?=20=EC=A1=B0=ED=95=A9=20=EB=B6=84=EB=A5=98=20=ED=91=9C=20=C2=B7?= =?UTF-8?q?=20=EC=B9=B4=EB=93=9C=20=EC=85=8B=20=EC=82=AC=EC=9D=B4=20?= =?UTF-8?q?=EA=B0=84=EA=B2=A9=20107px=20=E2=86=92=2012px=20=C2=B7=20?= =?UTF-8?q?=ED=91=9C=20=EC=95=84=EB=9E=98=20=EC=A4=84=20=C2=B7=20=EC=B9=B4?= =?UTF-8?q?=EB=93=9C=20=EC=B9=B8=20=EC=9C=84=20=EC=A4=84=20=EC=97=86?= =?UTF-8?q?=EC=95=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 카드가 보일 때 표 자리 최소 높이 240px 풀어 표 높이만큼만 - 카드 칸 위 구분선 · 안쪽 여백 12px 없앰(메인 칸 간격 하나만) - 조합 분류 표 틀 아래 줄 없앰(마지막 줄 칸 선이 표를 닫음) - 확인 시나리오 resources/tester/ui_checks/45-5_분류표_카드_간격.js Co-Authored-By: Claude Opus 5.5 Claude-Session: https://claude.ai/code/session_01EYJJRCfHfdCGNhmXTjQKV7 --- .../M02_MasterTemplete_Structure.css | 15 ++++++--- .../tester/ui_checks/45-5_분류표_카드_간격.js | 32 +++++++++++++++++++ 2 files changed, 43 insertions(+), 4 deletions(-) create mode 100644 resources/tester/ui_checks/45-5_분류표_카드_간격.js diff --git a/M02_MasterTemplete/M02_MasterTemplete_Structure.css b/M02_MasterTemplete/M02_MasterTemplete_Structure.css index 674d1bd2d..2284bcbfe 100644 --- a/M02_MasterTemplete/M02_MasterTemplete_Structure.css +++ b/M02_MasterTemplete/M02_MasterTemplete_Structure.css @@ -18,9 +18,7 @@ flex: none; grid-auto-rows: var(--m02-struct-card-h); grid-template-columns: repeat(3, minmax(0, 1fr)); /* 도면 · 일위대가 · 면적산출(40-2) */ - padding-top: var(--spacing-12); - border-top: 1px solid var(--color-border); - min-width: 0; + min-width: 0; /* 표와 사이 = 메인 칸 간격 하나 · 구분선 없음(45-5) */ } /* 상세 칸이 좁으면(카드 하나 300px 아래) 1열 — 좌측 패널을 접어도 맞게 상세 칸 폭으로 잼 @@ -46,9 +44,18 @@ overflow-y: auto; } -/* 표는 줄어들지 않음(줄면 표가 카드 위로 넘침) */ +/* 표는 줄어들지 않음(줄면 표가 카드 위로 넘침) · 표 높이만큼만(빈 칸 최소 높이 없음 · 45-5) */ .m02-main:has(> .m02-main__extra > .m02-struct:not([hidden])) > .m02-main__host { flex-shrink: 0; + min-height: 0; +} + +/* 분류 표 틀 아래 줄 없음 — 마지막 줄 칸 선이 표를 닫음(45-5) */ +.m02-main:has(> .m02-main__extra > .m02-struct:not([hidden])) + > .m02-main__host + > .ui-sheet--combo + > .ui-sheet__scroll { + border-bottom: 0; } /* 카드 = 제목 + 머리 + 본문 — 본문이 남는 높이를 채움 · 넘치면 카드 안 스크롤 */ diff --git a/resources/tester/ui_checks/45-5_분류표_카드_간격.js b/resources/tester/ui_checks/45-5_분류표_카드_간격.js new file mode 100644 index 000000000..1cf8bcf97 --- /dev/null +++ b/resources/tester/ui_checks/45-5_분류표_카드_간격.js @@ -0,0 +1,32 @@ +/* 45-5 — M02 구조물 조합 상세(항목 고른 화면) · 분류 표와 카드 셋(도면 정보 · 일위대가 · 면적산출) 사이 간격 · 구분선 + * 시작 화면: M02 마스터 템플릿 · 마스터 층(#/m02-master-template?open=구조물조합&root=master) · 나무에 item1 이 있음 + * 부르는 법: orca eval --expression "$(cat 이 파일)" (async 식 · JSON 글을 돌려줌) + * 기대 수치: + * - gap = 표 틀 아래 끝 ~ 첫 카드 위 끝 = 메인 칸 간격(12px 안팎 · 옛 107px) + * - tableLine = 0(표 틀 아래 줄 없음) · lastRow > 0(마지막 줄 칸 선이 표를 닫음) + * - cardsLine = 0 · cardsPad = 0(카드 칸 위 줄 · 안쪽 여백 없음) · hr = 0 + */ +(async () => { + const w = (ms) => new Promise((r) => setTimeout(r, ms)); + document.querySelector('[data-node="i|item1"]').click(); + for ( + let t = 0; + t < 5000 && !document.querySelector(".m02-struct:not([hidden]) .m02-struct__card"); + t += 100 + ) + await w(100); + await w(300); + const scroll = document.querySelector(".m02-main__host .ui-sheet__scroll"); + const struct = document.querySelector(".m02-struct"); + const card = struct.querySelector(".m02-struct__card"); + const cells = scroll.querySelectorAll("th, td"); + const cs = (e) => getComputedStyle(e); + return JSON.stringify({ + gap: Math.round(card.getBoundingClientRect().top - scroll.getBoundingClientRect().bottom), + tableLine: parseFloat(cs(scroll).borderBottomWidth), + lastRow: parseFloat(cs(cells[cells.length - 1]).borderBottomWidth), + cardsLine: parseFloat(cs(struct).borderTopWidth), + cardsPad: parseFloat(cs(struct).paddingTop), + hr: document.querySelectorAll(".m02-main hr").length, + }); +})();