[FIX] timo-web Pretendard 폰트 미적용 수정 - #93
Conversation
- next/font로 설정된 --font-family-pretendard 변수를 실제로 소비하는 font-family 규칙을 globals.css에 추가했습니다
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
github-actions
Bot
added
⏰ Timo-web
Walkthroughapps/timo-web/app/globals.css에 새로운 `@layer ChangesPretendard 폰트 전역 적용
Estimated code review effort: 1 (Trivial) | ~2 minutes Possibly related PRs
Suggested labels: `🛠️ Setup` Suggested reviewers: `ehye1` 폰트 하나 고치는데 이렇게 정성이라니, Pretendard도 감동할 위트 넘치는 6줄짜리 수정이네요! 🎨✨ (참고: Tailwind CSS 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@apps/timo-web/app/globals.css`:
- Around line 5-9: The font-family rule is duplicated in both the app and
design-system global styles, which will create maintenance drift once the export
issue is fixed. Keep the `* { font-family: var(--font-family-pretendard),
sans-serif; }` rule as the single source of truth in
`apps/timo-web/app/globals.css`, and remove or deprecate the matching rule in
`packages/timo-design-system/src/styles/globals.css` once that stylesheet is no
longer needed. If the design-system rule must remain temporarily, add a clear
TODO/comment near the duplicate so it is easy to consolidate later.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: ASSERTIVE
Plan: Pro Plus
Run ID: dca5d45b-3024-4bb7-b837-8b5d81d32a05
📒 Files selected for processing (1)
apps/timo-web/app/globals.css
| @layer base { | ||
| * { | ||
| font-family: var(--font-family-pretendard), sans-serif; | ||
| } | ||
| } |
There was a problem hiding this comment.
📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value
Pretendard 변수 연결 확인 완료 — 폰트가 이제 실제로 적용됩니다 👍
layout.tsx에서 주입한 --font-family-pretendard 변수를 * 선택자로 소비하는 흐름이 정확합니다. PR 목표대로 폰트가 전역에 실제로 반영되는 구조입니다.
다만 참고로, packages/timo-design-system/src/styles/globals.css에 동일한 규칙(* { font-family: var(--font-family-pretendard), sans-serif; })이 이미 존재합니다. 지금은 디자인 시스템의 styles export 문제로 인해 의도적으로 중복 정의한 것으로 보이나, 해당 export 이슈가 해결되면 두 곳의 규칙이 중복되어 유지보수 부담이 생길 수 있습니다. 후속 작업 시 한쪽으로 통합하는 걸 권장드립니다. 관련 문서: MDN @layer
As per path instructions, docs/architecture/components.md에 명시된 대로 "This PR’s approach—app-wide global styling (via apps/timo-web/app/globals.css)... is consistent with treating fonts as an app-wide concern applied at the global layer" 이므로 이 위치에 규칙을 두는 것 자체는 적절합니다.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@apps/timo-web/app/globals.css` around lines 5 - 9, The font-family rule is
duplicated in both the app and design-system global styles, which will create
maintenance drift once the export issue is fixed. Keep the `* { font-family:
var(--font-family-pretendard), sans-serif; }` rule as the single source of truth
in `apps/timo-web/app/globals.css`, and remove or deprecate the matching rule in
`packages/timo-design-system/src/styles/globals.css` once that stylesheet is no
longer needed. If the design-system rule must remain temporarily, add a clear
TODO/comment near the duplicate so it is easy to consolidate later.
Source: Path instructions
Timo Performance ReportBundle Size — timo-web
Lighthouse — timo-web
Image Optimization — timo-web
측정 커밋: |
ehye1
left a comment
ehye1
left a comment
There was a problem hiding this comment.
굿굿!!! 폰트가 적용이 되지 않고 있었구나...
yumin-kim2
left a comment
yumin-kim2
left a comment
There was a problem hiding this comment.
미적용을 발견하시다니 예리하십니다 🤟🤟
3 participants
ISSUE 🔗
close #92
What is this PR? 🔍
timo-web에서 Pretendard 폰트가 실제로 적용되지 않던 문제를 수정했습니다.
배경
apps/timo-web/app/layout.tsx에서next/font/local로PretendardVariable.woff2를 로드해--font-family-pretendardCSS 변수를pretendard.variable클래스명을 통해<html>에 설정하고 있었습니다.font-family규칙이 timo-web 어디에도 없어, 변수만 정의된 채 소비되지 않고 브라우저 기본 sans-serif가 그대로 렌더링됐습니다.apps/timo-web/app/globals.css에--font-family-pretendard변수를 직접 소비하는font-family규칙을 추가해, 디자인 시스템 패키지의 스타일 export 구성과 무관하게 timo-web 자체에서 폰트가 적용되도록 했습니다.폰트 적용
apps/timo-web/app/globals.css의@layer base에* { font-family: var(--font-family-pretendard), sans-serif; }규칙을 추가했습니다.--font-family-pretendard변수 자체는<html>에 세팅하지만, 이를 실제 요소에 적용하는 규칙이 timo-web에 없어 폰트가 무의미하게 정의만 되어 있었습니다.*)에font-family를 지정해 모든 요소가--font-family-pretendard변수(존재하지 않으면sans-serif로 폴백)를 상속받도록 했습니다.@repo/timo-design-system)의stylesexport가 실제 스타일 파일(globals.css)이 아닌 빈components.css를 가리키고 있는 문제는 이번 PR 범위에서 제외했으며, 별도 이슈로 분리해 후속 작업으로 진행할 예정입니다.To Reviewers
디자인 시스템 패키지의
stylesexport 자체를 고치는 대신 timo-web 쪽 globals.css에서 직접font-family를 지정하는 방식을 택했습니다. 디자인 시스템 export 문제는 범위가 더 크고 다른 앱에도 영향을 줄 수 있어 별도 이슈로 분리했습니다. 이 접근이 임시방편으로 괜찮은지, 아니면 이번 PR에서 export 구조까지 같이 정리하는 게 나을지 의견 부탁드립니다.Screenshot 📷
Test Checklist ✔
pnpm turbo run check-types --filter=timo-web통과pnpm turbo run lint --filter=timo-web— 미실행 확인: 기존 미커밋 design-system 파일의 import 순서 warning으로 실패했으며, 이번 PR 변경 파일(globals.css)과는 무관함