Files
Aislo/M02_MasterTemplete/M02_MasterTemplete_UI_Style.css
T
eomsangdonandClaude Sonnet 5.5 154d693599 feat(M02): 구조물 관리 화면 — 층 인자(개인 · 회사) · 층별 권한 · 대시보드 카드
- 주소 `?layer=personal|company`(없으면 시스템) — 라우터가 인자를 떼고 `currentQuery` 로 읽음 · 층 고정 풂
- 층 길 접두어 `/layers/{층}` — 구조물집계표 · 조합 · 복사 호출이 화면 층을 따름(시스템은 옛 길 그대로)
- 제목 셋(마스터 템플릿 · 구조물 관리(회사) · 구조물 관리(개인)) · 돌아가기 층 무관 · 도면 양식은 시스템 층만
- 편집 권한 — 시스템 SYSTEM_ADMIN · 회사 ADMIN 또는 is_master · 개인 본인 · 읽기만이면 단추 숨김 + [개인용으로 복사]
- 회사 없음 → 「회사부터 등록」 안내 · 대시보드 카드 「구조물 관리」(USER 개인용 · ADMIN · SYSTEM_ADMIN 회사용 + 개인용)
- 시험 test_m02_layer_screen.py 5 · test_m02_structure_panel.py 갱신

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_019Kyw9qnkJ94pC1A4PfpDtA
2026-09-29 12:09:31 +09:00

148 lines
3.3 KiB
CSS

/* M02 마스터 템플릿 — 좌측 패널 + 메인. 카드·목록·줄 모양은 공용 ui-sidebar-*
(ui_template_overlay.css, M01 과 한 벌) — 여기는 패널 위 여백만. */
.m02-side {
padding-top: var(--spacing-8);
}
.m02-side__empty {
margin: 0;
color: var(--color-text-muted);
font-size: var(--text-body-sm);
}
/* 구조물 집계 양식 하위 컨테이너(구조물 도면 · 면적산출 · 재료산출 · 자재 조합) — 들여 씀 */
.m02-side__summary > .ui-sidebar-card {
margin-left: var(--spacing-8);
}
.m02-side__row {
display: flex;
flex-wrap: wrap;
gap: var(--spacing-4);
}
.m02-main {
display: flex;
flex-direction: column;
gap: var(--spacing-12);
min-width: 0;
padding: var(--spacing-16) var(--spacing-24);
}
.m02-main__head {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--spacing-12);
}
.m02-main__title {
flex: 0 1 auto;
min-width: 3rem;
overflow-wrap: anywhere; /* 번호 + 이름 — 잘리지 않게 줄바꿈 */
margin: 0;
color: var(--color-text);
font-size: var(--text-body);
}
.m02-main__head .ui-btn {
white-space: nowrap;
}
.m02-main__slot {
display: flex;
flex: 1 1 auto;
align-items: center;
min-width: 0;
}
.m02-main__notice {
display: flex;
align-items: center;
gap: var(--spacing-8);
padding: var(--spacing-8) var(--spacing-12);
border-left: 4px solid var(--color-danger);
background: color-mix(in srgb, var(--color-danger) 10%, var(--color-canvas));
color: var(--color-danger);
font-size: var(--text-body-sm);
}
.m02-main__host {
min-height: 240px;
}
/* 면적산출 · 재료산출 전체 편집 — `.ss` 는 height:100% 로 부모 높이를 받음 · 도면 편집과 같이 메인 칸을 화면 높이로 채움 */
.m02-main:has(> .m02-main__host > .ss) {
box-sizing: border-box;
height: calc(100vh - var(--spacing-64));
min-height: 0;
}
.m02-main__host:has(> .ss) {
display: flex;
flex: 1 1 0;
min-height: 0;
}
.m02-main__host > .ss {
flex: 1 1 0;
min-width: 0;
}
.m02-main__empty {
margin: 0;
padding: var(--spacing-24);
color: var(--color-text-muted);
text-align: center;
}
.m02-modal__field {
display: flex;
flex-direction: column;
gap: var(--spacing-4);
}
/* 좌측 「자재 조합」 상세(메인 칸) — 이름 · 비고 · 본뜬키 + 담은 자재 표(줄 모양은 재료산출 옆 판 `m02-mat__row`) */
.m02-matset {
display: flex;
flex-direction: column;
gap: var(--spacing-12);
max-width: 56rem;
font-size: var(--text-body-sm);
}
.m02-matset__fields {
display: flex;
flex-wrap: wrap;
align-items: flex-end;
gap: var(--spacing-12);
}
.m02-matset__head {
margin: 0;
color: var(--color-text);
font-size: var(--text-body);
}
/* 층 화면 — 회사용 읽기만 안내 막대 · 회사 없음 안내 */
.m02-layer-bar {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--spacing-8);
padding: var(--spacing-8) var(--spacing-12);
border-bottom: 1px solid var(--color-border);
background: var(--color-surface-raised);
color: var(--color-text-secondary);
font-size: var(--text-body-sm);
}
.m02-layer-need {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: var(--spacing-12);
padding: var(--spacing-24);
color: var(--color-text);
}