- 측구 줄 맨 오른쪽 [상세] · 투명 막 · 카드 안 가리는 넓은 쪽 · 카드 다시 그리면 갱신 - 구조물 글 structure_note — USER_TOUCHED_KEYS 두 벌 · CrossSectionPatch · 세션 초안 → [저장] - 표 값 = 서버 cross-quantity-table 한 길(B07 _quantity_table 을 캐시 설계로) · 칸 배치 B07 그대로 - test_138_cross_detail Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01JywHxQuWPk6UYXTebyrBoU
90 lines
2.2 KiB
CSS
90 lines
2.2 KiB
CSS
/* =============================================================================
|
|
* B06_Section_UI_Style_Cross_Detail.css
|
|
* 횡단 카드 [상세] 단추 · 모달(138-4) — 투명 막(누름 통과) · 글 칸 · CAD 꼴 그림 · B07 수량표.
|
|
* ========================================================================== */
|
|
|
|
/* 측구 줄 맨 오른쪽 — ⋯ 가 보이면 그 옆, 숨으면 혼자 오른쪽 끝 */
|
|
.b06-design__detail {
|
|
flex: 0 0 auto;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.b06-design__more:not([hidden]) ~ .b06-design__detail {
|
|
margin-left: 0;
|
|
}
|
|
|
|
/* 막은 투명 · 누름은 아래 화면으로 — 모달 몸만 받음 */
|
|
.ui-modal__backdrop.b06-detail__backdrop {
|
|
background-color: transparent;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.b06-detail__backdrop > .ui-modal.b06-detail {
|
|
pointer-events: auto;
|
|
overflow: auto;
|
|
box-shadow: var(--shadow-lg);
|
|
}
|
|
|
|
.b06-detail__note {
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
resize: vertical;
|
|
font: inherit;
|
|
}
|
|
|
|
/* 가벼운 CAD 꼴 — 어두운 바탕 · 카드 그림 복제에 다크 색 토큰을 덮어씀 */
|
|
.b06-detail__cad {
|
|
--color-bg: #111111;
|
|
--color-surface: #111111;
|
|
--color-surface-raised: #1a1a1a;
|
|
--color-border: #3a3a3a;
|
|
--color-text: #f2f2f2;
|
|
--color-text-body: #e6e6e6;
|
|
--color-text-secondary: #b8b8b8;
|
|
--color-text-muted: #8b8b8b;
|
|
--color-primary: #c9a8ff;
|
|
--color-warning: #ffd34d;
|
|
--color-danger: #ff5f57;
|
|
--color-success: #4cd37b;
|
|
border-radius: var(--radius-cards);
|
|
background: #111111;
|
|
color: #f2f2f2;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.b06-detail__cad > svg {
|
|
display: block;
|
|
width: 100%;
|
|
height: auto;
|
|
}
|
|
|
|
/* B07 횡단 수량 산출표 — 칸 배치 그대로 */
|
|
.b06-detail__table.is-loading {
|
|
opacity: 0.6;
|
|
}
|
|
|
|
.b06-detail__qtable {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
font-size: var(--text-caption);
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
|
|
.b06-detail__qtable th,
|
|
.b06-detail__qtable td {
|
|
padding: 2px 4px;
|
|
border: 1px solid var(--color-border);
|
|
text-align: center;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.b06-detail__qtable th {
|
|
font-weight: 500;
|
|
color: var(--color-text-secondary);
|
|
}
|
|
|
|
.b06-detail__qtable tr:first-child > th {
|
|
text-align: left;
|
|
color: var(--color-text);
|
|
}
|