Skip to content

외부 폰트 -suit variable 적용#15

Merged
Hys-Lee merged 69 commits intoprography:mainfrom
Hys-Lee:design
Jun 13, 2025
Merged

외부 폰트 -suit variable 적용#15
Hys-Lee merged 69 commits intoprography:mainfrom
Hys-Lee:design

Conversation

@Hys-Lee
Copy link
Collaborator

@Hys-Lee Hys-Lee commented Jun 12, 2025

폰트 처리

Figma에서의 폰트 클래스명

피그마에선 font-['SUIT_Variable'] 의 형태로 클래스명이 주어집니다.
이를 수정없이 그대로 사용할 수 있도록 설정했습니다.

Next에서.

위 형태로 폰트를 적용하려면, font-family로 tailwind에 적용해야 합니다.
이로 인해 taliwind.config.ts를 추가해야만 했습니다.

Storybook에서.

스토리북은 next/font/local을 사용할 수 없습니다.
이에 스토리북용 font-face를 css에 추가해 사용하도록 했습니다.

디자인 토큰 처리

Primitive 디자인 토큰 추가

디자인 입히다보니 Primitive 토큰도 사용되는 것 같아 추가했습니다.

Hys-Lee added 30 commits May 21, 2025 12:44
포크한 레포에 작동 테스틀 위해 연결
스토리북 형태도 세팅함
구조 수정 및 tailwind prefix에 맞게 mapping
이전 패키지 버전에선 빌드가 안 됐음.
Hys-Lee added 25 commits June 8, 2025 22:34
code형태 아니어야 했기에.
숫자 표기 안되는 문제로 인해.
다른 프로젝트랑 연결 되어 있었기에 수정.
forked에서의 pull request로는 secret을 사용할 수 없기 때문에.
파싱되지 않던 형식 처리, tailwind에선 사용되지 않는 토큰 제거, tailwind prefix 매핑 수정.
next실행과 storybook실행에 따로 설정이 필요해서 각각 했습니다.
figma에서 사용되는 font-['SUIT_Variable'] 형식을 사용하기 위해 tailwind.config.ts를 생성했습니다.
@Hys-Lee Hys-Lee self-assigned this Jun 12, 2025
@Hys-Lee Hys-Lee merged commit ff9d8ec into prography:main Jun 13, 2025
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant