Open
Conversation
- 피그마 디자인 기반 Badge 스타일링 완료
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
📌 관련 이슈
#12
✨ 변경 내용
<HomePage 반영>
배지 컴포넌트들을 배치하여 피그마 디자인 시안 구현했음 (이 페이지에 새로 만든 컴포넌트들을 배치하여 구조 설계하기)
<신규 컴포넌트 생성>
Badge 컴포넌트: src/components/common/Badge.jsx (배지 공통 컴포넌트)
Card 컴포넌트: src/components/common/Card.jsx (카드 컴포넌트 기본 구조)
<Badge 컴포넌트 구현하기>
Tailwind CSS 스타일링: 피그마 디자인 기반으로 테일윈드 클래스를 사용하여 배지 UI 구현
디자인 토큰 적용: 'tokens.css'에 정의된 변수를 활용하여 공통 배지 색상 및 폰트 스타일 지정 (src/styles/tokens.css)
📸 스크린샷(선택)
📚 참고사항
<추후 작업 예정>