---
title: "📓 작업일지 — 셀모드 독립스크롤 최하단 도달성 수정 (근력 → 체성분·러닝 확장)"
category: "worklog"
parent: "Claude Code 작업일지"
updated: "2026-07-03"
priority: "Medium"
purpose: "데스크탑(≥1024px) 셀모드에서 표 하단의 max-height 고정값이 위쪽 툴바·힌트·페이저 높이를 무시해 최하단 행이 화면 밖으로 잘려 스크롤로도 확인할 수 없던 문제를, 근력 셀모드에서 먼저 잡고 이어서 체성분·러닝 셀모드까지 제네릭하게 확장 적용한 스레드."
read_when: ["셀모드 스크롤 도달성", "cellmode-root", "cms-table-wrap", "62dvh 클리핑", "table-wrap flex"]
document_type: "개발일지"
source_status: "generated"
knowledge_group: "03_history"
work_timestamp: "20260703_204554"
source_of_truth: "https://dallog-tools.hansbridge.co.kr/knowledge/"
context: "달록 본레포(ccy-hansbridge/dallog), 커밋 4b49d17(근력 최초수정) → 702ac7c(Codex 검수 flex보정) → 029ad8f(3 셀모드 제네릭 확장), 2026-07-03 19:19~20:45. 거버넌스 §0.6 규칙 내 버그수정."
---

# 작업일지 — 셀모드 독립스크롤 최하단 도달성 수정

> 사장님이 데스크탑 화면에서 근력 셀모드의 표 최하단 행이 잘려 보이지 않는 것을 직접 확인·제보한 것을 계기로 시작된 스레드. 근력에서 원인을 잡은 뒤, 같은 증상이 체성분·러닝 셀모드에도 있음을 확인해 3개 셀모드에 공통 적용했다.

## 1. 무엇을 했나

### 근력 셀모드 최초 수정 (`4b49d17`, 19:19)
- **버그**: 데스크탑(≥1024px)에서 `.cms-table-wrap`의 `max-height: 62dvh` 고정값이 위쪽 툴바·힌트·페이저 높이를 고려하지 않아, 컨테이너 하단이 `hist-page`(overflow:hidden) 밖으로 밀려나 최하단 행이 잘리고 스크롤로도 끝까지 닿지 않는 문제.
- **수정**: `CellModeStrength` 루트에 `.cms-root` 클래스를 부여하고, 데스크탑 전용 `@media`에서 `hist-scroll--cell > .cms-root`가 남은 공간을 flex로 채우도록 하고 `.cms-table-wrap`을 `flex:1`·`min-height:0`·`max-height:none`으로 변경. 모바일은 자연 페이지 스크롤 방식이라 기존 62dvh를 그대로 유지(무변경).

### Codex 검수 flex 보정 (`702ac7c`, 19:24)
- `flex: 1 1`로는 행이 적을 때 표가 남은 공간까지 늘어나 빈 공간이 커지는 경미한 문제가 발견됨 → `grow`를 0으로 낮춰 `flex: 0 1 auto`로 변경. 행이 적으면 내용 높이만큼만 차지하고, 넘칠 때만 줄어들며 스크롤이 생기도록 수정(하단 도달성은 유지).

### 체성분·러닝 셀모드로 확장 (`029ad8f`, 20:45)
- 사장님이 체성분·러닝 셀모드에도 근력과 동일한 하단 클리핑 증상(데스크탑 62dvh 고정)이 있음을 확인.
- `cms-root` 클래스명을 `cellmode-root`로 제네릭하게 리네임하고, 3개 셀모드 루트(Strength/Body/Running) 모두에 공통 적용.
- table-wrap flex 채움 규칙을 `.cms-table-wrap`·`.cell-table-wrap`·`.run-grid-scroll` 3개 클래스로 확장(`flex:0 1 auto`·`max-height:none`). 모바일 62dvh는 그대로 무변경.

## 2. 주요 변경 파일

| 파일 | 내용 |
|---|---|
| `src/components/cellmode/CellModeStrength.tsx` | `cms-root`→`cellmode-root` 클래스 적용 |
| `src/components/cellmode/CellModeBody.tsx` | `cellmode-root` 공통 적용 |
| `src/components/cellmode/CellModeRunning.tsx` | `cellmode-root` 공통 적용 |
| `src/index.css` | flex 채움 규칙 3개 클래스로 확장, flex:0 1 auto 보정 |

## 3. 관련 커밋

- `4b49d17` fix(history): 근력 셀모드 독립스크롤이 최하단 행까지 도달하도록 flex 세로채움(데스크탑) (2026-07-03 19:19)
- `702ac7c` fix(history): 셀모드 table-wrap flex 0 1 auto — 행 적으면 내용높이·많으면 스크롤(Codex 검수 반영) (2026-07-03 19:24)
- `029ad8f` fix(history): 체성분·러닝 셀모드도 동일 스크롤 수정 — cellmode-root 제네릭 통일(3 셀모드 하단 도달) (2026-07-03 20:45)

## 4. 남은 이슈

커밋 기준 별도로 언급된 남은 이슈는 없음. 이 스크롤 도달성 결함은 이후(07-04) "런타임 전수검사가 a11y 스냅샷(DOM 존재 여부만 확인)으로는 스크롤 클리핑을 잡아내지 못한다"는 검증 방법 한계의 교훈 사례로 별도 기록되었다.