feat(B05/ui): 유토곡선 스크롤바·구분선·선택 토글·패널 시인성(21~25)

- 21: 유토곡선 높이를 스크롤러 clientHeight 기준으로 — 스크롤바가 Y축 라벨을 덮던
  문제 해소, overflow-x scroll 고정으로 높이 안정화
- 22: 절토·성토 요약 줄을 종단 열 안으로 — 배수유역도 좌측 구분선 25px 끊김 해소
- 23: 선택 토글 해제 — 종단·유토곡선 측점 재클릭/빈 곳 클릭, 사이드바 구조물 재클릭
  시 해제(null 전파로 3D·그래프·목록·유역 강조 동기 해제)
- 24: 좌측 제목 패널(B04~B07 공용) 우측 가장자리 강조색 라인
- 25: 접힌 손잡이 강조색 배경 틴트 — 닫힌 패널이 있음을 상시 표시

Playwright: 재클릭 1→0, 빈곳 클릭 0, 스크롤러 226=곡선 226, 구분선 간극 1px,
접힘 틴트 확인, 콘솔 오류 0. typecheck 통과.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-08-04 19:34:38 +09:00
co-authored by Claude Opus 5
parent 344d1fbbb9
commit 05887b6a7e
5 changed files with 71 additions and 12 deletions
+17
View File
@@ -28,6 +28,13 @@
border-top: 0;
border-bottom: 0;
border-left: 0;
/* 크기 조절은 안 되지만 조절 패널들과 같은 강조색 가장자리(2026-08-04 사용자 지시)
— 리사이저 상시 표시선과 같은 색·기조로 경계가 구분되게 한다. */
border-right-color: color-mix(
in srgb,
var(--panel-handle-border, var(--color-border)) 75%,
transparent
);
border-radius: 0;
transition: transform var(--transition-base);
}
@@ -105,6 +112,16 @@
transition: transform var(--transition-fast);
}
/* 닫힌 패널의 손잡이 — 접힌 내용이 있음을 강조색 배경 틴트로 알린다(2026-08-04 제안 적용).
열려 있으면 평상 배경이라, 틴트가 있는 손잡이 = "펼칠 것이 있다"로 읽힌다. */
.ui-workflow-overlay__handle[aria-expanded="false"] {
background: color-mix(
in srgb,
var(--panel-handle-border, var(--color-primary)) 20%,
var(--color-surface-raised)
);
}
/* 이름표 달린 손잡이 — 화살표+텍스트를 나란히 담도록 고정 폭을 푼다.
화살표(삼각형)는 flex 압축에서 제외해 이름표 유무와 무관하게 같은 크기를 유지한다. */
.ui-workflow-overlay__handle.is-labeled {