eomsangdonandClaude Opus 5.5
61eb0bc4e6
- 도면을 품은 때만 메인 높이를 화면 높이로 · 칸 · 부품 · CAD 를 flex 로 늘림 - 실측 CAD 캔버스 495×228 → 495×571 · 좌측 패널 접으면 691×621 Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01PxvYb5ufV1kWdBvZbpDfu6
83 lines
1.7 KiB
CSS
83 lines
1.7 KiB
CSS
/* M02 도면 양식 편집 부품 — 위 도구 줄(작도 영역 · 자리표 · 단추) + 아래 웹캐드. */
|
|
|
|
/* 도면 칸이 메인을 꽉 채우고 창 크기를 따른다 — 메인 칸(`ui-workflow-layout__main`)은
|
|
높이가 정해지지 않아(min-height 만) 100% 가 안 먹으므로 화면 높이로 잡는다.
|
|
표 양식일 때는 페이지 쪽 모양 그대로 두려고 도면을 품은 때만 건다. */
|
|
.m02-main:has(> .m02-main__host > .m02-drawing) {
|
|
box-sizing: border-box;
|
|
height: calc(100vh - var(--spacing-64));
|
|
min-height: 0;
|
|
}
|
|
|
|
.m02-main__host:has(> .m02-drawing) {
|
|
display: flex;
|
|
flex: 1 1 0;
|
|
min-height: 0;
|
|
}
|
|
|
|
.m02-drawing {
|
|
display: flex;
|
|
flex: 1 1 0;
|
|
flex-direction: column;
|
|
gap: var(--spacing-8);
|
|
width: 100%;
|
|
min-width: 0;
|
|
min-height: 0;
|
|
}
|
|
|
|
.m02-drawing > .cad-host {
|
|
flex: 1 1 0;
|
|
}
|
|
|
|
.m02-drawing__toolbar {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: flex-end;
|
|
gap: var(--spacing-8) var(--spacing-16, 16px);
|
|
}
|
|
|
|
.m02-drawing__title {
|
|
align-self: center;
|
|
font-size: 0.78rem;
|
|
font-weight: 600;
|
|
color: var(--color-text);
|
|
}
|
|
|
|
.m02-drawing__area {
|
|
display: flex;
|
|
align-items: flex-end;
|
|
gap: var(--spacing-8);
|
|
}
|
|
|
|
.m02-drawing__area .ui-field {
|
|
width: 5.5rem;
|
|
}
|
|
|
|
.m02-drawing__fields {
|
|
display: flex;
|
|
flex: 1 1 20rem;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
gap: var(--spacing-4, 4px);
|
|
}
|
|
|
|
.m02-drawing__field {
|
|
padding: 2px 8px;
|
|
border: 1px solid var(--color-border);
|
|
border-radius: 1440px;
|
|
background-color: var(--color-surface);
|
|
color: var(--color-text);
|
|
font-size: 0.72rem;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.m02-drawing__field[data-source="도면"] {
|
|
color: var(--color-text-muted);
|
|
}
|
|
|
|
.m02-drawing__actions {
|
|
display: flex;
|
|
gap: var(--spacing-8);
|
|
margin-left: auto;
|
|
}
|