diff --git a/E02_StabGround/E02_StabGround_UI_Style.css b/E02_StabGround/E02_StabGround_UI_Style.css index 7a5602ff1..e962124d4 100644 --- a/E02_StabGround/E02_StabGround_UI_Style.css +++ b/E02_StabGround/E02_StabGround_UI_Style.css @@ -95,6 +95,7 @@ } .e02-input--num { + min-width: 56px; text-align: right; } @@ -151,3 +152,21 @@ .e02-status.is-error { color: var(--color-danger); } + +.e02-table .ui-btn { + white-space: nowrap; +} + +.e02-input[data-path$=".water"] { + min-width: 120px; +} + +/* 좁은 화면 — 표만 옆으로 밀림(카드 밖으로 안 나감) */ +.e02-card { + overflow-x: auto; +} + +/* 물성 표는 열이 많아 한 줄 통째 */ +.e02-card--wide { + grid-column: 1 / -1; +} diff --git a/E02_StabGround/E02_StabGround_UI_Tables.ts b/E02_StabGround/E02_StabGround_UI_Tables.ts index 1614b16a7..e3cfcc101 100644 --- a/E02_StabGround/E02_StabGround_UI_Tables.ts +++ b/E02_StabGround/E02_StabGround_UI_Tables.ts @@ -204,6 +204,7 @@ function materialsCard(view: E02View): HTMLElement { } const { section, head } = card("E02_Card_Materials", table(headers, rows), mapRow); + section.classList.add("e02-card--wide"); headButtons( view, head, @@ -483,6 +484,7 @@ function loadsCard(view: E02View): HTMLElement { export function buildCards(view: E02View): { root: HTMLElement; refreshStations: () => void } { const root = el("div", { className: "e02-cards" }); const zones = zonesCard(view); - root.append(materialsCard(view), zones.section, safetyCard(view), loadsCard(view)); + zones.section.classList.add("e02-card--wide"); + root.append(materialsCard(view), safetyCard(view), loadsCard(view), zones.section); return { root, refreshStations: zones.refresh }; }