Files
Aislo/B09_Estimation/B09_Estimation_UI_Page.css
T
eomsangdonandClaude Opus 5.5 5a244c8421 feat(B09): 총괄설계내역서 · 공사원가계산서 줄 레벨 구분(185-1)
- 총괄 = 가.~바. 소계 lv1 굵게 · 제비율 · 입력 줄 lv2
- 원가계산서 = 구분 줄 lv1 · 비목 소계 lv2 · 세목 lv3
- 182 is-lvN 글자 크기 재사용 · 들여쓰기 = 명칭 칸(is-indent) · 앞 칸(is-flat) 그대로
- 새 시험 test_185_1_b09_total_level

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_015sDZSjFvoiDjdGpgj3muc3
2026-10-10 12:54:52 +09:00

128 lines
4.1 KiB
CSS

/* B09 원가계산 — 탭 줄 · 안내 글. 색은 테마 변수만(밝음 · 어두움 같이). */
.b09-estimation {
display: flex;
flex-direction: column;
gap: var(--spacing-8);
padding: var(--spacing-16) var(--spacing-24); /* B08 본문과 같은 값 */
}
.b09-estimation .ui-general-block__empty,
.b09-estimation__hint {
color: var(--color-text-secondary);
}
.b09-estimation__hint {
margin: 0 0 var(--spacing-8);
font-size: var(--text-caption);
}
.b09-estimation__tabs {
display: flex;
flex-wrap: wrap;
gap: var(--spacing-8); /* B08 위 · 보조 탭 줄과 같은 값(181-1) */
padding-bottom: var(--spacing-8);
border-bottom: 1px solid var(--color-border);
}
/* 아래 탭 없는 위 탭 — 보이지 않는 단추 한 줄로 높이만 채움(탭 바꿀 때 몸통이 안 튐) */
.b09-estimation__tabs--blank > .ui-btn {
visibility: hidden;
}
/* 표 머리 — 좁은 열에서 말줄임 대신 줄바꿈 */
[data-b09-table] thead th {
white-space: normal;
overflow-wrap: anywhere;
}
/* 171-3 묶음 탭 머리 — 안내 글 + 보기 단추 */
.b09-estimation__bar {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: var(--spacing-8);
}
/* 182 설계내역서 레벨 — 글자 크기(줄 높이 28px 고정 → 16px 까지) · 첫 칸 들여쓰기 1em × (레벨 − 1) */
.b09-estimation .ui-data-table__table tbody tr.is-lv1 td {
font-size: var(--text-body);
}
.b09-estimation .ui-data-table__table tbody tr:is(.is-lv2, .is-lv3) td {
font-size: var(--text-body-sm);
}
.b09-estimation .ui-data-table__table tbody tr:is(.is-lv4, .is-lv5, .is-lv6) td {
font-size: 13px;
}
.b09-estimation .ui-data-table__table tbody tr.is-group td {
font-weight: var(--font-weight-bold);
}
.b09-estimation .ui-data-table__table tbody tr.is-lv2 td:first-child {
padding-left: calc(var(--spacing-8) + 1em);
}
.b09-estimation .ui-data-table__table tbody tr.is-lv3 td:first-child {
padding-left: calc(var(--spacing-8) + 2em);
}
.b09-estimation .ui-data-table__table tbody tr.is-lv4 td:first-child {
padding-left: calc(var(--spacing-8) + 3em);
}
.b09-estimation .ui-data-table__table tbody tr:is(.is-lv5, .is-lv6) td:first-child {
padding-left: calc(var(--spacing-8) + 4em);
}
/* 166-2 설계내역서 손 줄 — 사용자가 더한 줄 표시(왼쪽 띠) */
.b09-estimation .ui-data-table__table tbody tr.is-hand td:first-child {
background-image: linear-gradient(to right, var(--color-primary) 3px, transparent 3px);
}
/* 181-2 표 보기 — 목록표에서 고른 호표 줄 구간 전체 붉은 외곽선(머리 accent 밑줄은 덮음) */
.b09-estimation .ui-data-table__table tbody tr.is-pick td {
--pick-t: inset 0 0 0 0 transparent;
--pick-b: inset 0 0 0 0 transparent;
--pick-l: inset 0 0 0 0 transparent;
--pick-r: inset 0 0 0 0 transparent;
box-shadow: var(--pick-t), var(--pick-b), var(--pick-l), var(--pick-r);
}
.b09-estimation .ui-data-table__table tbody tr.is-pick.is-pick-top td {
--pick-t: inset 0 2px 0 var(--color-danger);
}
.b09-estimation .ui-data-table__table tbody tr.is-pick.is-pick-end td {
--pick-b: inset 0 -2px 0 var(--color-danger);
}
.b09-estimation .ui-data-table__table tbody tr.is-pick td:first-child {
--pick-l: inset 2px 0 0 var(--color-danger);
}
.b09-estimation .ui-data-table__table tbody tr.is-pick td:last-child {
--pick-r: inset -2px 0 0 var(--color-danger);
}
/* 183-3 자재단가대비표 — 적용 단가를 낸 출처 단가 칸(고른 출처 · 기본 최저) */
.b09-estimation .ui-data-table__table tbody td.is-picked {
background: color-mix(in srgb, var(--color-accent) 22%, var(--color-canvas));
font-weight: var(--font-weight-bold);
}
/* 185-1 총괄 · 원가계산서 레벨 — 글자 크기 = 위 is-lvN · 들여쓰기 = 명칭 칸(is-indent) · 앞 칸(is-flat)은 그대로 */
.b09-estimation .ui-data-table__table tbody tr[class*="is-lv"] td.is-flat:first-child {
padding-left: var(--spacing-8);
}
.b09-estimation .ui-data-table__table tbody tr.is-lv2 td.is-indent {
padding-left: calc(var(--spacing-8) + 1em);
}
.b09-estimation .ui-data-table__table tbody tr.is-lv3 td.is-indent {
padding-left: calc(var(--spacing-8) + 2em);
}