[Feature] 다크모드 도입

[Malloc72P]

현황

dark:·prefers-color-scheme 사용 0건. giscus 댓글도 theme="light"로 고정(apps/blog/src/components/post-detail/giscus-comments.tsx:32). 본문/배경이 라이트로 고정돼 있다.

문제

코드 위주 기술 블로그에서 다크모드는 야간 가독성의 사실상 표준 기대치인데 부재한다. 시스템 다크 사용자에게 강한 흰 배경이 노출된다.

제안

• CSS 변수 + class 기반 테마 토글, localStorage 저장
• giscus theme를 동적 연동, 코드 하이라이트 테마도 함께 전환
• 이전, 다음 포스트 버튼 #12(디자인 토큰)가 선행되면 작업이 수월

임팩트 / 난이도

임팩트 중 / 난이도 중 (#12 의존)

---

🤖 코드베이스 조사 기반 작성 (Claude Code)

[Malloc72P]

✅ 완료

• `html.dark` 클래스 + `localStorage` 기반 테마 토글(`ThemeToggle`), 헤더에 배치 (feat(blog): 다크모드 도입 — 토큰 기반 테마 전환 (#90) #123)
• Tailwind v4 유틸이 `var(--color-*)`를 참조하는 특성을 활용해 `.dark`에서 색 변수만 오버라이드 → 컴포넌트 대부분 변경 없이 전체 전환
• FOUC 방지 인라인 스크립트(paint 전 테마 결정), 시스템 설정(`prefers-color-scheme`) 존중
• giscus 테마 동적 연동 (feat(blog): 다크모드 도입 — 토큰 기반 테마 전환 (#90) #123)
• 팔레트를 완전 검정 대신 디스코드풍 블루그레이로 조정, 보더/디바이더 가시성 개선 (fix(blog): 다크모드 팔레트 디스코드풍으로 조정 (#90 후속) #124, 사용자 피드백 반영)

라이트 모드는 100% 동일하게 유지됨.