Files
Aislo/M02_MasterTemplete/M02_MasterTemplete_UI_Style.css
T
eomsangdonandClaude Sonnet 5 ef5a7e9771 fix(M02): 좌측 패널 공용 틀 M01 과 맞춤
- ui_template_overlay.css 에 ui-sidebar-panel · ui-sidebar-card · ui-sidebar-list ·
  ui-sidebar-row 공용 클래스 추가
- M01·M02 좌측 코드가 공용 클래스를 씀 — 카드 여백·둥글기·바탕 · 목록 간격 ·
  줄 선택 표시 한 벌
- M02 좌측 전용 CSS 중복 규칙 제거(없는 토큰 --radius-md 로 둥글기 안 먹던 것도 해소)
- M02 표/도면/구조물 카드 처음 접힘으로 M01 과 맞춤 · 새로·본떠·지우기 단추 줄 카드 안으로

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01K7JS47SacjPxZ718QsZKyr
2026-09-27 18:24:34 +09:00

84 lines
1.6 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__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: nowrap;
align-items: center;
gap: var(--spacing-12);
}
.m02-main__title {
flex: 0 1 auto;
min-width: 3rem;
max-width: 9rem;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
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;
}
.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);
}