feat: 격자선 + 활성 줄 (CM6 layer) #13

Merged

tyange merged 1 commit from feat/modern-editor into main

2026-09-09 06:59:08 +00:00

tyange commented

2026-09-09 06:58:58 +00:00

Owner

src/editor/gridLines.ts — CM6 layer() 익스텐션이 세로·가로 격자선을
RectangleMarker로 그린다. 크기·원점은 하드코딩이 아니라 CM6 실측에서:
칸 폭 = coordsAtPos(한글) 두 지점 x 차, 원점 = coordsAtPos(0), 행 높이 =
view.defaultLineHeight. layer.update가 geometry/doc/viewport 변경에 재계산 →
폰트 크기·웹폰트 스왑·줌에 전부 따라간다(CSS 하드코딩 그라디언트를 피한 이유).

highlightActiveLine() + 옅은 밴드(--foreground 4%)
.cm-content를 flexGrow:0 + width:max-content로 shrink-wrap — 안 하면 활성 줄·
격자가 무대 폭 전체(1400px+)로 늘어남
--grid-line 토큰 추가 (라이트/다크)
docs/grid-editor.md에 격자선 절 + 다음 단계(반각 문자 정렬)

Co-Authored-By: Claude Sonnet 5 noreply@anthropic.com
Claude-Session: https://claude.ai/code/session_01MfW22NQxomSVmTAQiQCjQu

`src/editor/gridLines.ts` — CM6 `layer()` 익스텐션이 세로·가로 격자선을 `RectangleMarker`로 그린다. 크기·원점은 하드코딩이 아니라 **CM6 실측**에서: 칸 폭 = `coordsAtPos(한글)` 두 지점 x 차, 원점 = `coordsAtPos(0)`, 행 높이 = `view.defaultLineHeight`. `layer.update`가 geometry/doc/viewport 변경에 재계산 → 폰트 크기·웹폰트 스왑·줌에 전부 따라간다(CSS 하드코딩 그라디언트를 피한 이유). - `highlightActiveLine()` + 옅은 밴드(`--foreground` 4%) - `.cm-content`를 `flexGrow:0` + `width:max-content`로 shrink-wrap — 안 하면 활성 줄· 격자가 무대 폭 전체(1400px+)로 늘어남 - `--grid-line` 토큰 추가 (라이트/다크) - `docs/grid-editor.md`에 격자선 절 + 다음 단계(반각 문자 정렬) Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01MfW22NQxomSVmTAQiQCjQu

tyange added 1 commit

2026-09-09 06:58:58 +00:00

feat: 격자선 + 활성 줄 (CM6 layer)

Deploy Palim to AWS (Nginx) / deploy (push) Successful in 2m42s

Details

d250cdd128

`src/editor/gridLines.ts` — CM6 `layer()` 익스텐션이 세로·가로 격자선을
`RectangleMarker`로 그린다. 크기·원점은 하드코딩이 아니라 **CM6 실측**에서:
칸 폭 = `coordsAtPos(한글)` 두 지점 x 차, 원점 = `coordsAtPos(0)`, 행 높이 =
`view.defaultLineHeight`. `layer.update`가 geometry/doc/viewport 변경에 재계산 →
폰트 크기·웹폰트 스왑·줌에 전부 따라간다(CSS 하드코딩 그라디언트를 피한 이유).

- `highlightActiveLine()` + 옅은 밴드(`--foreground` 4%)
- `.cm-content`를 `flexGrow:0` + `width:max-content`로 shrink-wrap — 안 하면 활성 줄·
  격자가 무대 폭 전체(1400px+)로 늘어남
- `--grid-line` 토큰 추가 (라이트/다크)
- `docs/grid-editor.md`에 격자선 절 + 다음 단계(반각 문자 정렬)

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01MfW22NQxomSVmTAQiQCjQu

tyange merged commit d250cdd128 into main

2026-09-09 06:59:08 +00:00