feat(M02): 집계표 아래 카드 — 도면 정보 · 면적산출 · 재료산출 3열 같은 폭 · 카드 최소 300px 아래로 좁으면 2열 → 1열 자동

- grid auto-fit/minmax 한 규칙 · 도면 정보 전체 폭 고정 제거 · 높이는 통일 변수 그대로

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_019Kyw9qnkJ94pC1A4PfpDtA
This commit is contained in:
2026-09-28 15:37:58 +09:00
co-authored by Claude Sonnet 5
parent fedc860365
commit ac83e1b550
@@ -6,26 +6,18 @@
display: contents;
}
/* 도면 정보는 한 줄 전체 · 면적산출 · 재료산출은 반반(둘 합 + 간격 = 도면 정보 폭) ·
카드 하나가 360px 안 되면 한 줄에 하나씩(칸 폭에 따라 자동 · 창이 작아지면 바로 바뀜 · 두 열이 최대) */
/* 카드 셋 나란히(같은 폭) · 카드 하나가 300px 안 되면 자동으로 2열 → 1열(칸 폭에 따라 · 창이 작아지면 바로 바뀜) */
.m02-struct {
/* CAD 미리보기 · 면적산출 · 재료산출 내용 높이 — 한 값(창 높이에 맞춰 함께 변함) */
--m02-struct-body-h: clamp(18rem, 60vh, 40rem);
display: grid;
grid-template-columns: repeat(
auto-fit,
minmax(min(100%, max(360px, calc((100% - var(--spacing-8)) / 2))), 1fr)
);
grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
align-items: start;
padding-top: var(--spacing-12);
border-top: 1px solid var(--color-border);
min-width: 0;
}
.m02-struct > :first-child {
grid-column: 1 / -1;
}
.m02-struct > * {
min-width: 0;
}