From b3ab6028cd3593a757f106508d48db5970728537 Mon Sep 17 00:00:00 2001 From: umsangdon Date: Sun, 2 Aug 2026 01:07:14 +0900 Subject: [PATCH] =?UTF-8?q?fix(B05):=20=EC=B8=A1=EC=A0=90=20=ED=95=98?= =?UTF-8?q?=EC=9D=B4=EB=9D=BC=EC=9D=B4=ED=8A=B8=EA=B0=80=20=ED=91=9C=20?= =?UTF-8?q?=EA=B0=92=EC=9D=84=20=EA=B0=80=EB=A6=AC=EB=8D=98=20=EB=AC=B8?= =?UTF-8?q?=EC=A0=9C=20+=20=EA=B3=84=ED=9A=8D=EA=B3=A0=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80=20=EA=B0=95=EC=A1=B0=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 하이라이트 열이 덮는 자리의 규칙 측점 값 셀을 통째로 숨겨(hideCoveredCells), 비정규 측점을 고를 때마다 좌우 최대 2개 열의 값이 사라졌다. 표는 그대로 두고 선택된 값만 위에 얹도록 그 함수와 .is-covered 규칙을 걷어냈다. 하이라이트 열에서 계획고만 자주색 테두리·글자색으로 따로 강조되던 것도 없앴다. 평상시에는 다른 셀과 같은 모습이고, 고칠 수 있다는 표시는 hover·focus에서만 나타난다. 직접 입력 기능은 그대로다. Co-Authored-By: Claude Opus 5 (1M context) --- .../B05_wf2_Route_UI_Profile_Table.ts | 32 ++----------------- B05_wf2_Route/B05_wf2_Route_UI_Style.css | 22 ++++++------- 2 files changed, 14 insertions(+), 40 deletions(-) diff --git a/B05_wf2_Route/B05_wf2_Route_UI_Profile_Table.ts b/B05_wf2_Route/B05_wf2_Route_UI_Profile_Table.ts index adbdfad8..f0241186 100644 --- a/B05_wf2_Route/B05_wf2_Route_UI_Profile_Table.ts +++ b/B05_wf2_Route/B05_wf2_Route_UI_Profile_Table.ts @@ -505,15 +505,13 @@ export function createProfileTable(options: ProfileTableOptions): HTMLElement { ? alignment.stations.findIndex((row) => row.station_id === options.selectedStationId) : -1; if (selectedIrregular) { - const centerX = x(selectedIrregular.chainage_m); - // 비정규 측점은 측점 격자와 무관한 위치라 오버레이가 좌우 이웃 셀을 반씩 덮어 값이 잘려 - // 보인다. 겹치는 규칙 측점 셀을 숨겨 하이라이트 창이 깨끗한 자리에 뜨게 한다. - hideCoveredCells(table, centers, centerX, cellWidth); + // 표는 그대로 두고 선택된 값만 위에 얹는다 — 이웃 셀을 숨기면 고를 때마다 표가 비어 + // 보인다(2026-08-02 사용자 지시). table.append( buildSelectedColumn( selectedIrregular.chainage_m, alignment, - centerX, + x(selectedIrregular.chainage_m), cellWidth, stationInterval, display, @@ -537,27 +535,3 @@ export function createProfileTable(options: ProfileTableOptions): HTMLElement { } return table; } - -/** - * 하이라이트 열이 덮는 자리의 규칙 측점 값 셀을 숨긴다. - * 셀과 하이라이트 열 모두 폭 `cellWidth`를 중심 정렬로 쓰므로, 중심 간 거리가 `cellWidth` - * 미만이면 두 사각형이 겹친다. 겹치는 측점은 어차피 값이 잘려 읽을 수 없으므로 통째로 숨긴다. - */ -function hideCoveredCells( - table: HTMLElement, - centers: readonly number[], - columnCenter: number, - cellWidth: number, -): void { - const covered = new Set(); - centers.forEach((center, index) => { - if (Math.abs(center - columnCenter) < cellWidth) covered.add(index); - }); - if (covered.size === 0) return; - table.querySelectorAll(".b05-profile-table__row").forEach((row) => { - const cells = row.querySelectorAll( - ".b05-profile-table__cell, .b05-profile-table__curve", - ); - covered.forEach((index) => cells[index]?.classList.add("is-covered")); - }); -} diff --git a/B05_wf2_Route/B05_wf2_Route_UI_Style.css b/B05_wf2_Route/B05_wf2_Route_UI_Style.css index 7c929413..34303bd2 100644 --- a/B05_wf2_Route/B05_wf2_Route_UI_Style.css +++ b/B05_wf2_Route/B05_wf2_Route_UI_Style.css @@ -749,13 +749,6 @@ 0 4px 12px rgb(0 0 0 / 28%); } -/* 하이라이트 창이 덮은 자리의 규칙 측점 값 셀 — 값이 잘려 읽을 수 없으므로 숨긴다. - 자리(레이아웃)는 유지해야 세로 구분선 격자가 끊기지 않으므로 visibility로 감춘다. */ -.b05-profile-table__cell.is-covered, -.b05-profile-table__curve.is-covered { - visibility: hidden; -} - .b05-profile-table__irregular-col-cell { display: flex; flex: 1 1 0; @@ -809,16 +802,23 @@ width: 92%; height: 88%; padding: 0; - border: 1px solid var(--color-royal-amethyst, rgb(109 40 217)); + /* 계획고만 테두리·색으로 따로 강조하지 않는다 — 같은 열의 다른 값과 같아 보여야 한다 + (2026-08-02 사용자 지시). 고칠 수 있다는 표시는 커서와 포커스 테두리로 충분하다. */ + border: 1px solid transparent; border-radius: 2px; - background: var(--color-surface); - color: var(--color-royal-amethyst, rgb(109 40 217)); + background: transparent; + color: inherit; font: inherit; - font-weight: var(--font-weight-medium); text-align: center; pointer-events: auto; } +.b05-profile-table__irregular-input:focus, +.b05-profile-table__irregular-input:hover { + border-color: var(--color-royal-amethyst, rgb(109 40 217)); + background: var(--color-surface); +} + /* ─── 계획고 편집 버튼 (크기 유지·상시 표시·밝은 글자) ───────────────────── */ .b05-profile-edit { position: absolute;