Files
Aislo/M02_MasterTemplete/StructOptions/M02_SO_Style.css
T
eomsangdonandClaude Opus 5.5 37634e2c26 feat(M02): 46-2 구조물 옵션 그룹 — 종류마다 이름 붙은 묶음 편집 · 정본 · /structure-types groups
- 정본 `resources/master_template/구조물옵션그룹.json` = {type_id: [{id, 이름, 옵션[]}]} · 빈 그룹 됨
- 길 GET · PUT /api/m02/structure-option-groups(시스템 관리자) · 검사(없는 종류 · 키 · 겹침 · 옵션 두 그룹 422 · 낡은 판 409)
- /api/projects/structure-types 종류마다 groups(차례 · 이름 · 옵션) · 깨진 표 = 그룹 없음
- 옵션 보이기 화면 = 그룹 목록(이름 · 위로 · 아래로 · 지우기 · 추가) + 옵션 줄 「들어갈 자리」(본체 · 그룹)
- 좌측 「구조물 옵션 보이기」 = 시스템 관리자만
- 시험 test_m02_structure_option_groups.py

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01MPcuokNm1ZR2kqgGGDfaJA
2026-10-05 13:21:37 +09:00

115 lines
2.3 KiB
CSS

/* 좌측 「구조물 옵션 보이기」 화면(메인 칸) — 왼쪽 종류(군별) · 오른쪽 옵션 체크 */
.m02-opts {
display: flex;
flex-direction: column;
gap: var(--spacing-12);
max-width: 64rem;
font-size: var(--text-body-sm);
}
/* 종류 제목 */
.m02-options__head {
margin: 0;
color: var(--color-text);
font-size: var(--text-body);
}
.m02-opts__panes {
display: grid;
grid-template-columns: minmax(14rem, 20rem) 1fr;
gap: var(--spacing-16);
align-items: start;
}
.m02-opts__kinds,
.m02-opts__list {
max-height: calc(100vh - 20rem);
overflow-y: auto;
display: flex;
flex-direction: column;
gap: var(--spacing-4);
min-width: 0;
}
.m02-opts__group {
margin: var(--spacing-8) 0 0;
color: var(--color-text-muted);
font-size: var(--text-body-sm);
}
.m02-opts__kind {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--spacing-4);
padding: var(--spacing-4) var(--spacing-8);
border: 1px solid transparent;
border-radius: var(--radius-sm);
background: none;
color: var(--color-text);
font: inherit;
text-align: left;
cursor: pointer;
}
.m02-opts__kind:hover {
background: var(--color-mist-violet);
}
.m02-opts__kind.is-active {
border-color: var(--color-accent);
background: var(--color-mist-violet);
}
/* 옵션 줄 = 왼쪽 보이기 체크 · 라벨 · 키 · 표시 / 오른쪽 들어갈 자리(본체 · 그룹) */
.m02-opts__option {
display: flex;
align-items: center;
justify-content: space-between;
gap: var(--spacing-8);
padding: var(--spacing-4) 0;
border-bottom: 1px solid var(--color-border);
}
.m02-opts__check {
display: flex;
flex-wrap: wrap;
align-items: baseline;
gap: var(--spacing-8);
min-width: 0;
cursor: pointer;
}
/* 옵션 그룹(PLAN 46-2) — 그룹 줄 = 이름 · 옵션 수 · 위로 · 아래로 · 지우기 */
.m02-sog {
display: flex;
flex-direction: column;
gap: var(--spacing-4);
padding: var(--spacing-8) var(--spacing-12);
border: 1px solid var(--color-border);
border-radius: var(--radius-sm);
background: var(--color-surface-raised);
}
.m02-sog__row {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--spacing-8);
}
.m02-sog__name {
flex: 1 1 12rem;
min-width: 0;
}
.m02-sog__place {
flex: none;
width: 11rem;
}
.m02-opts__key {
color: var(--color-text-muted);
font-size: 11px;
}