Files
Aislo/A00_Common/line_stack.css
T
eomsangdonandClaude Opus 5.5 c11baa441c feat(804-2): 단가산출 「줄 쌓기」 새 탭 — M01 단가산출 기초 · M02 단가산출 · 기계 시간당 경비 수식 펼침 · KaTeX
- 공용 화면 A00_Common/line_stack_* — 위 옵션 · 왼쪽 줄 쌓기 편집 · 오른쪽 산출근거(경쟁사 시트 꼴) · 맨 아래 합계 상자
- 모델 common_util_line_stack.ts — 수식 문서 ↔ 줄 쌓기 한 벌 왕복(차림 = 문서 칸 `쌓기` · 기본과 다를 때만)
- 기계 · 단가산출 줄 단가 수 누름 = 그 문서를 같은 계산기로 셈해 펼침(손료 식 · 운전경비 · 노 · 재 · 경 · 계)
- 공식 묶음 · 틀 풀기(단가산출 결과 → 이 문서 식) · 내 틀(이 브라우저) · 「내 틀 (… 에서 변경)」
- 수식 탭과 같은 길 · 같은 캐시 · 탭 바꾸면 다시 읽음 · [수식 저장] = 서버 정본 셈
- KaTeX(MIT) — vite 미리 묶기에서 뺌(rolldown 이 글자 규칙 서로게이트 범위를 깨뜨림)
- 시험 test_804_2 6(왕복 1,518 · 금액 · 기계 펼침 = hourly · 틀 풀기 · 저장 · 이음)

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-11-08 00:34:29 +09:00

198 lines
3.4 KiB
CSS

/* 줄 쌓기 탭(804-2) — 위 옵션 · 가운데 왼쪽 편집 | 오른쪽 산출근거 · 맨 아래 합계 상자 · 색은 공통 값만 */
.lstk {
display: flex;
flex-direction: column;
gap: var(--spacing-12);
min-width: 0;
container-type: inline-size;
}
.lstk__head {
display: flex;
flex-direction: column;
gap: var(--spacing-8);
}
.lstk__bar,
.lstk__badges,
.lstk__tools {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: var(--spacing-8);
}
.lstk__areas {
display: grid;
grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
gap: var(--spacing-12);
align-items: start;
}
.lstk:not([data-edit="1"]) .lstk__areas {
grid-template-columns: minmax(0, 1fr);
}
.lstk:not([data-edit="1"]) .lstk__left {
display: none;
}
/* 탭 폭이 좁으면(1366 화면 등) 편집 위 · 산출근거 아래 */
@container (max-width: 1240px) {
.lstk__areas {
grid-template-columns: minmax(0, 1fr);
}
}
/* ── 왼쪽 편집 ── */
.lstk-edit {
display: flex;
flex-direction: column;
gap: var(--spacing-8);
}
.lstk-item {
display: flex;
flex-direction: column;
gap: var(--spacing-4);
padding: var(--spacing-8);
border: 1px solid var(--color-border);
border-radius: var(--radius-sm);
}
.lstk-ihead,
.lstk-row,
.lstk-fhead,
.lstk-frow,
.lstk-find,
.lstk-ltools {
display: flex;
flex-wrap: wrap;
align-items: flex-end;
gap: var(--spacing-4) var(--spacing-8);
min-width: 0;
}
.lstk-frow {
align-items: center;
}
.lstk-line {
position: relative;
display: flex;
flex-direction: column;
gap: var(--spacing-4);
padding: var(--spacing-8);
padding-inline-end: 120px;
border-radius: var(--radius-sm);
background: var(--color-surface-sunken);
}
.lstk-ltools {
position: absolute;
inset-block-start: var(--spacing-4);
inset-inline-end: var(--spacing-4);
gap: 0;
}
.lstk-kind {
font-size: var(--text-caption);
font-weight: var(--font-weight-medium);
color: var(--color-text-secondary);
}
.lstk-fhead[data-tpl="changed"] .lstk-kind {
color: var(--color-accent);
}
.lstk-f-s {
width: 6em;
}
.lstk-f-m {
width: 9em;
}
.lstk-f-l {
flex: 1 1 12em;
min-width: 10em;
}
.lstk-sym {
font-weight: var(--font-weight-medium);
}
.lstk-val,
.lstk-unit,
.lstk-tag,
.lstk-hint,
.lstk-link {
font-size: var(--text-body-sm);
color: var(--color-text-secondary);
}
.lstk-link {
color: var(--color-text-body);
}
.lstk-tag {
padding: 0 var(--spacing-4);
border: 1px solid var(--color-border);
border-radius: var(--radius-sm);
}
.lstk-empty {
font-size: var(--text-body-sm);
color: var(--color-text-muted);
}
.lstk-miss,
.lstk-tex .lstk-miss {
color: var(--color-danger);
}
/* ── 오른쪽 산출근거 ── */
.lstk-out .lstk-h {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0 var(--spacing-4);
padding-inline-start: calc(var(--lstk-depth, 0) * var(--spacing-24));
white-space: normal;
}
.lstk-out tr.head,
.lstk-out tr.item,
.lstk-out tr.total {
font-weight: var(--font-weight-medium);
}
.lstk-out tr.subsum,
.lstk-out tr.total {
background: var(--color-surface-sunken);
}
.lstk-out tr.is-sub .lstk-h {
color: var(--color-text-secondary);
}
.lstk-out tr.subhead .lstk-h {
color: var(--color-accent);
}
.lstk-gap {
display: inline-block;
width: var(--spacing-24);
}
.lstk-pack {
display: inline-flex;
align-items: center;
gap: var(--spacing-4);
}
.lstk-tex .katex {
font-size: 1.05em;
}