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;