MSG-606 fix: 카카오 라벨을 Apple 버튼과 같은 20/600으로, 스플래시를 필맵 아이콘으로

[Ss0Mae]

개요

2026-09-25 사용자 지적 2건.

1. 로그인 버튼 폰트 불일치 — 카카오 라벨 16 bold vs Apple 네이티브 버튼(62px 높이에서 약 20pt 세미볼드). 폰트 종류는 둘 다 시스템 폰트(앱이 커스텀 폰트를 싣지 않음)라 크기·굵기만 달랐다.
2. 앱 중간중간 파란 화면에 ^ — Expo 템플릿 스플래시(흰 셰브런 + #0066CC)가 그대로 남아 있었고, iOS가 백그라운드에서 앱을 죽인 뒤 재시작할 때마다 노출됐다.

변경

• features/auth/ui/kakao-login-button.tsx — 라벨 text-fm-heading font-bold → text-fm-display(20/600). Apple 버튼은 심사 안전을 위해 네이티브 유지.
• app.config.js expo-splash-screen — 배경 #FFFFFF, 이미지 assets/images/icon.png(160). 템플릿 splash-icon.png 삭제.

검증

항목	결과
typecheck · lint · format:check · check:duplication	통과
vitest features/auth	92건 통과
iOS 시뮬레이터 Debug 빌드 → 콜드 스타트 스플래시	흰 배경 + 필맵 아이콘 확인 (스크린샷 아래)
codex review (--base develop --scope branch)	지적 없음

📸 스크린샷

콜드 스타트 스플래시 (흰 배경 + 필맵 아이콘)	로그인 화면 (카카오 라벨 20/600 = Apple 버튼)

iPhone 17 Pro 시뮬레이터, Debug 빌드(네이티브 스플래시 자산 재생성 후 콜드 스타트).

🤖 Generated with Claude Code

[claude]

Claude finished @Ss0Mae's task in 3m 28s —— View job

---

🔍 PR #168 코드 리뷰 완료

작업 목록

• 컨텍스트 및 CLAUDE.md 확인
• 변경 파일 diff + 주변 코드 확인 (Read/Grep, 순차 진행)
• 버그/로직, React/TS, 성능, 가독성, 보안 관점 리뷰
• 인라인 코멘트 작성 (해당 없음 — 구체적 결함 미발견)
• 요약 코멘트 게시 (gh pr comment)

결과 요약
작은 범위(3파일, +8/-6)의 수정이며 구체적인 코드 결함은 발견하지 못했습니다. text-fm-display가 이미 fontWeight: 600을 가지므로 기존 font-bold(700)가 덮어써 발생했던 불일치를 제거로 정확히 바로잡았고, 스플래시 이미지 교체도 이미 쓰이던 icon.png 재사용 + 잔여 참조 없음을 직접 확인했습니다. 사소한 참고로 PR 본문 스크린샷 섹션이 아직 (업로드 예정)으로 비어 있는 점만 남겼습니다. 전체 리뷰는 별도 코멘트로 게시했습니다: #168 (comment)

[github-actions]

React Doctor found no new issues. 🎉

_{Reviewed by React Doctor for commit aee860b.}

[claude]

📋 코드 리뷰 요약 (PR #168)

작은 범위(3파일, +8/-6)의 수정이며, 두 항목 모두 직접 코드를 읽고 확인했습니다. 구체적인 결함은 발견하지 못했습니다.

잘한 점

• 카카오 라벨 폰트 (kakao-login-button.tsx): packages/tailwind-preset/index.ts를 확인한 결과 text-fm-display는 이미 fontWeight: "600" 플러그인 값을 갖고 있습니다. 기존 font-bold(700)가 이 값을 덮어써서 실제 발생한 불일치였을 가능성이 높고, 이번에 font-bold를 제거하면서 정확히 20/600으로 정리됐습니다. docs/DESIGN_SYSTEM.md의 text-fm-display 정의(600/20/26)와도 일치합니다.
• 스플래시 (app.config.js): image: "./assets/images/icon.png"로 바꾼 것은 이미 루트 icon: 필드가 쓰는 것과 동일한 자산이라 별도 에셋 추가 없이 재사용했고, icon.png를 직접 열어 확인한 결과 배경이 흰색이라 backgroundColor: "#FFFFFF"와 자연스럽게 어우러집니다(안드로이드 adaptiveIcon처럼 마스킹 이중 라운딩 문제가 splash에는 적용되지 않음 — expo-splash-screen은 단순 중앙 배치이므로 무해). grep으로 레포 전체에서 삭제된 splash-icon.png에 대한 잔여 참조가 없음을 확인했습니다.
• 두 변경 모두 JSDoc에 "왜 이렇게 바꿨는지"(사용자 지적 날짜·근거)를 남겨 추적 가능성이 좋습니다.
• login-screen.tsx의 버튼 높이(h-15.5 = 62px)와 PR 설명의 "62px 높이에서 약 20pt" 근거가 실제 코드와 일치함을 확인했습니다.

이슈

없음 — 버그/로직 오류, React/TS 안티패턴, 성능, 가독성, 보안 관점에서 지적할 항목을 찾지 못했습니다.

🟢 사소한 참고 (코드 결함 아님)

• PR 본문의 검증 표에는 "iOS 시뮬레이터 콜드 스타트 스플래시 — 흰 배경 + 필맵 아이콘 확인 (스크린샷 아래)"라고 되어 있지만, 실제 "📸 스크린샷" 섹션은 아직 (업로드 예정)으로 비어 있습니다. 코드 리뷰 대상은 아니지만, 머지 전에 실물 스크린샷을 첨부해 검증 근거를 남기는 게 좋겠습니다.

참고 사항

• 이 환경에서는 pnpm typecheck/lint/vitest 등 명령 실행이 승인 절차에 막혀 직접 재현하지 못했습니다(네트워크/서브프로세스 계열 Bash 명령이 모두 승인 대기 상태로 남음). PR 본문에 기재된 통과 결과는 코드 정적 검토로 교차 검증했을 뿐 별도로 재실행하지는 않았습니다 — 필요하면 --allowedTools에 해당 명령을 추가해주세요.
• 서브에이전트·병렬 도구 사용 없이 Read/Grep으로 순차 진행했습니다.

🤖 Generated with Claude Code