feat: 셀 글로우를 무지개 링 → 노란 스퀴클 hover 효과로 교체 #5

Merged
tyange merged 1 commit from feat/cell-glow into main 2026-09-08 09:19:20 +00:00
Owner

FreeFrontend "Squircle with a Border on Hover"로 교체. hover한 칸에
노란 임보싱(inset box-shadow) 스퀴클이 scale 1→1.1 + opacity 0→1로
통통 튀며 뜬다(등장 이징 cubic-bezier(.51,.61,0,2.3), overshoot).

  • conic-gradient/mask/blur/--start 커서추적 로직 전부 제거 —
    이 효과는 background + box-shadow + scale 전이뿐
  • 오버레이는 항상 DOM에 두고(v-show 제거) cell-glow--on 클래스로
    opacity/scale만 토글해야 전이가 재생됨. 위치용 lastCell은 null로
    안 돌아가 퇴장 애니메이션이 마지막 칸 자리에서 재생
  • 스퀴클은 border-radius: 28%(작은 칸에선 clip-path와 구분 안 됨)
  • 색 토큰 --cell-glow-stops → --cell-glow-fill/-bevel-light/-bevel-dark
  • 오버레이가 글자를 덮으므로 mix-blend-mode로 틴트: 라이트 multiply,
    다크 screen(mask/blur 없어 예전 백지 버그와 무관)

docs·CLAUDE.md 갱신.

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

FreeFrontend "Squircle with a Border on Hover"로 교체. hover한 칸에 노란 임보싱(inset box-shadow) 스퀴클이 scale 1→1.1 + opacity 0→1로 통통 튀며 뜬다(등장 이징 cubic-bezier(.51,.61,0,2.3), overshoot). - conic-gradient/mask/blur/`--start` 커서추적 로직 전부 제거 — 이 효과는 background + box-shadow + scale 전이뿐 - 오버레이는 항상 DOM에 두고(`v-show` 제거) `cell-glow--on` 클래스로 opacity/scale만 토글해야 전이가 재생됨. 위치용 `lastCell`은 null로 안 돌아가 퇴장 애니메이션이 마지막 칸 자리에서 재생 - 스퀴클은 `border-radius: 28%`(작은 칸에선 clip-path와 구분 안 됨) - 색 토큰 `--cell-glow-stops` → `--cell-glow-fill`/`-bevel-light`/`-bevel-dark` - 오버레이가 글자를 덮으므로 mix-blend-mode로 틴트: 라이트 multiply, 다크 screen(mask/blur 없어 예전 백지 버그와 무관) docs·CLAUDE.md 갱신. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01MfW22NQxomSVmTAQiQCjQu
feat: 셀 글로우를 무지개 링 → 노란 스퀴클 hover 효과로 교체
All checks were successful
Deploy Palim to AWS (Nginx) / deploy (push) Successful in 2m15s
683b23fb15
FreeFrontend "Squircle with a Border on Hover"로 교체. hover한 칸에
노란 임보싱(inset box-shadow) 스퀴클이 scale 1→1.1 + opacity 0→1로
통통 튀며 뜬다(등장 이징 cubic-bezier(.51,.61,0,2.3), overshoot).

- conic-gradient/mask/blur/`--start` 커서추적 로직 전부 제거 —
  이 효과는 background + box-shadow + scale 전이뿐
- 오버레이는 항상 DOM에 두고(`v-show` 제거) `cell-glow--on` 클래스로
  opacity/scale만 토글해야 전이가 재생됨. 위치용 `lastCell`은 null로
  안 돌아가 퇴장 애니메이션이 마지막 칸 자리에서 재생
- 스퀴클은 `border-radius: 28%`(작은 칸에선 clip-path와 구분 안 됨)
- 색 토큰 `--cell-glow-stops` → `--cell-glow-fill`/`-bevel-light`/`-bevel-dark`
- 오버레이가 글자를 덮으므로 mix-blend-mode로 틴트: 라이트 multiply,
  다크 screen(mask/blur 없어 예전 백지 버그와 무관)

docs·CLAUDE.md 갱신.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01MfW22NQxomSVmTAQiQCjQu
tyange merged commit 683b23fb15 into main 2026-09-08 09:19:20 +00:00
Sign in to join this conversation.
No description provided.