eomsangdonandClaude Opus 5.5
d02c1d3f08
- 157-2 탭 머리 단추 = 「표로 보기」 ↔ 「호표별 보기」 · 고른 보기 localStorage 기억(못 읽으면 표) - 호표별 카드 = 표 줄 그대로 호표마다 묶음 · 머리 산근 n호표 · 공종 · 단위 · 합계 · 가름줄 없이 간격 · 긴 글 줄바꿈 · 줄 누름 이동 같음 - 157-3 산근 규격 글 = 기계 · 직종 원문번호 → 「이름 규격」(M02 85-1 도우미) · 원문번호는 풍선(두 보기 · 목록표) - 시험 test_157_2_b09_sangeun_views — 두 보기 같은 값 · 단추 바꿈 · 기억 실패 때 표 · 이름 규격 · 풍선 Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_015KYZ2HWWdUwZWYnn3tQz7X
113 lines
2.4 KiB
CSS
113 lines
2.4 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-4);
|
|
padding-bottom: var(--spacing-8);
|
|
border-bottom: 1px solid var(--color-border);
|
|
}
|
|
|
|
/* 표 머리 — 좁은 열에서 말줄임 대신 줄바꿈 */
|
|
[data-b09-table] thead th {
|
|
white-space: normal;
|
|
overflow-wrap: anywhere;
|
|
}
|
|
|
|
/* 157-2 산근 탭 머리 — 안내 글 + 보기 단추 */
|
|
.b09-estimation__bar {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
justify-content: space-between;
|
|
gap: var(--spacing-8);
|
|
}
|
|
|
|
/* 157-2 산근 호표별 카드 — 호표 사이 또렷이 · 안은 가름줄 없이 간격 */
|
|
.b09-sg-cards {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--spacing-24);
|
|
}
|
|
|
|
.b09-sg-card__head {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: baseline;
|
|
gap: var(--spacing-8);
|
|
margin-bottom: var(--spacing-8);
|
|
font-weight: var(--font-weight-bold);
|
|
}
|
|
|
|
.b09-sg-card__no {
|
|
color: var(--color-accent);
|
|
}
|
|
|
|
.b09-sg-card__unit {
|
|
color: var(--color-text-secondary);
|
|
}
|
|
|
|
.b09-sg-card__total {
|
|
margin-left: auto;
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
|
|
.b09-sg-card__line {
|
|
display: grid;
|
|
grid-template-columns: 7em minmax(0, 1fr) repeat(4, 7.5em) 10em;
|
|
column-gap: var(--spacing-8);
|
|
padding: var(--spacing-4) 0;
|
|
}
|
|
|
|
.b09-sg-card__cols,
|
|
.b09-sg-card__sub {
|
|
color: var(--color-text-secondary);
|
|
font-size: var(--text-caption);
|
|
}
|
|
|
|
.b09-sg-card__line.is-title {
|
|
margin-top: var(--spacing-4);
|
|
font-weight: var(--font-weight-bold);
|
|
}
|
|
|
|
.b09-sg-card__line.is-clickable {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.b09-sg-card__line.is-clickable:hover,
|
|
.b09-sg-card__line.is-focus,
|
|
.b09-sg-card.is-focus {
|
|
background: color-mix(in srgb, var(--color-accent) 8%, transparent);
|
|
}
|
|
|
|
.b09-sg-card__text,
|
|
.b09-sg-card__note {
|
|
white-space: pre-wrap;
|
|
overflow-wrap: anywhere;
|
|
}
|
|
|
|
.b09-sg-card__num {
|
|
text-align: right;
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
|
|
.b09-sg-card__cols .b09-sg-card__num {
|
|
font-variant-numeric: normal;
|
|
}
|