종목 상세 누적 볼륨 숫자 배치 수정 (2026-09-10)
- 기간: 2026-09-10, Codex 1세션. 오너 “수정 진행해줘”, #1552.
- 랜딩: 앱 PR #1555, release/v0.17.10
82d2073cc44136d1cc9fc7c9b365cce036db42a3(22:11 KST) 병합 완료. Production 배포는 수행하지 않았다. - 설계서: 없음(수리 건). 상세 원인·대안·검증은 BUG-111.
- 정본: 종목 상세 계약, 앱 records.css·fitInline.ts.
- 게이트: 실제 UiRecordsDetail·CSS를 렌더하는 recordsHeroLayout.browser.mjs를 기존 test:persistence-browser 명령에 연결. DB 변경 없음.
| Phase | 내용 | 상태 |
|---|---|---|
| Phase 1 | 실제 화면으로 부모 밖 넘침 재현 | 완료, c413c87e |
| Phase 2 | 부모 폭 제한·값과 단위 정렬·치수 감시 | 완료, 37e88543 |
320px에서 긴 숫자 줄이 부모보다 커져 축소 계산이 작동하지 않았다. 줄을 부모 안으로 제한하고 숫자·단위를 함께 중앙 정렬했으며, 글자 크기 변화와 후속 폰트 로드도 다시 측정한다. 값·계산·반올림·모달 기능은 유지했다.
| 개선 | 전 → 후 | 검증 |
|---|---|---|
| 320px, 1,000,000 kg 부모 밖 넘침 | 16.94px → 0 | Chromium 실제 경계 |
| 숫자·단위 배치 | 긴 값에서 영역 이탈 → 5개 폭·7개 값 모두 칸 내부 | Chromium·WebKit |
| 기본 검사 | Phase 1·2 각각 3,400 통과, 실패 0, 기존 skip 35 | npm run check |
비교 이미지는 동일한 실제 컴포넌트와 합성 데이터(320 CSS px, Chromium)를 사용했다. 사용자 첨부 화면의 촬영 빌드·폰트·기기 조건과 동일한 재현은 아니다.
수정 전:
수정 후:
미검증: Production 로그인 데이터 여정, 모든 OS 글자 확대 설정. 전체 full CI 통과로 보고하지 않는다.
필수 precheck는 static·단위 두 묶음 모두 통과(2분 46초), Merge Check는 success다. 문서 PR #62.