refactor: 글로우를 격자 프레임 → hover한 칸으로 이동, 칸 테두리 제거 #4

Merged

tyange merged 1 commit from feat/cell-glow into main

2026-09-08 08:05:17 +00:00

tyange commented

2026-09-08 08:05:05 +00:00

Owner

컨테이너(프레임) 전체가 아니라 마우스가 올라온 칸 하나에 CodePen 효과를
건다. 기존 칸 테두리(cell-rect stroke)는 제거 — 칸 경계는 hover 글로우로만
드러난다.

SVG 위에 HTML div.cell-glow 오버레이 1개. hover된 칸 위치로 퍼센트
배치(left = col/cols*100% …)해 스케일 계산 없이 어떤 축소율에서도 정합.
칸 간 이동은 left/top 0.12s 전이로 미끄러짐
hoveredCell은 Cell의 cellmouseenter emit로, 해제는 래퍼 @mouseleave
background를 풀 무지개 conic-gradient로(칸 크기에선 좁은 호가 잘 안 보임).
토큰 --grid-glow-stops → --cell-glow-stops(첫=끝 색 순환)
blur 11px → 9px(칸 스케일). .grid-glow → .cell-glow 전반 개명

docs·CLAUDE.md 갱신.

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

컨테이너(프레임) 전체가 아니라 마우스가 올라온 칸 하나에 CodePen 효과를 건다. 기존 칸 테두리(cell-rect stroke)는 제거 — 칸 경계는 hover 글로우로만 드러난다. - SVG 위에 HTML `div.cell-glow` 오버레이 1개. hover된 칸 위치로 퍼센트 배치(`left = col/cols*100%` …)해 스케일 계산 없이 어떤 축소율에서도 정합. 칸 간 이동은 left/top 0.12s 전이로 미끄러짐 - `hoveredCell`은 `Cell`의 `cellmouseenter` emit로, 해제는 래퍼 `@mouseleave` - `background`를 풀 무지개 conic-gradient로(칸 크기에선 좁은 호가 잘 안 보임). 토큰 `--grid-glow-stops` → `--cell-glow-stops`(첫=끝 색 순환) - blur 11px → 9px(칸 스케일). `.grid-glow` → `.cell-glow` 전반 개명 docs·CLAUDE.md 갱신. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01MfW22NQxomSVmTAQiQCjQu

tyange added 1 commit

2026-09-08 08:05:05 +00:00

refactor: 글로우를 격자 프레임 → hover한 칸으로 이동, 칸 테두리 제거

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

Details

b720c1a33d

컨테이너(프레임) 전체가 아니라 마우스가 올라온 칸 하나에 CodePen 효과를
건다. 기존 칸 테두리(cell-rect stroke)는 제거 — 칸 경계는 hover 글로우로만
드러난다.

- SVG 위에 HTML `div.cell-glow` 오버레이 1개. hover된 칸 위치로 퍼센트
  배치(`left = col/cols*100%` …)해 스케일 계산 없이 어떤 축소율에서도 정합.
  칸 간 이동은 left/top 0.12s 전이로 미끄러짐
- `hoveredCell`은 `Cell`의 `cellmouseenter` emit로, 해제는 래퍼 `@mouseleave`
- `background`를 풀 무지개 conic-gradient로(칸 크기에선 좁은 호가 잘 안 보임).
  토큰 `--grid-glow-stops` → `--cell-glow-stops`(첫=끝 색 순환)
- blur 11px → 9px(칸 스케일). `.grid-glow` → `.cell-glow` 전반 개명

docs·CLAUDE.md 갱신.

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

tyange merged commit b720c1a33d into main

2026-09-08 08:05:17 +00:00