TFG Design System

Design system for The Fair Golf

설치

``bash
npm install tfg-design-system
`

패키지 정보

- 패키지 이름: tfg-design-system
- 설명: Design system for The Fair Golf
- 저자: tfg-swbaek
- 이메일: swbaek@thefairgolf.com

사용법

$3

타이포그래피 스타일을 적용하려면, typography 객체를 import하여 사용하세요.

`typescript
import { typography } from 'tfg-design-system';

const styles = {
heading: {
...typography.size['2xl'],
...typography.weight.bold,
},
paragraph: {
...typography.size.base,
...typography.weight.regular,
},
};
`




디자인 추가 방법


디자인 시스템에 새로운 스타일을 추가하려면 다음 단계를 따르세요:
1. 토큰 파일 수정: src/tokens 폴더 내의 적절한 파일을 엽니다. 예를 들어, 새로운 색상을 추가하려면 colors.ts 파일을 수정합니다.
2. 새로운 스타일 추가: 원하는 스타일 속성을 추가합니다.
`typescript
// 예시: colors.ts
export const colors = {
primary: '#007AFF',
secondary: '#5856D6',
newColor: '#FF5733', // 새로운 색상 추가
};
`
3. 빌드 및 배포: 변경 사항을 저장한 후, 라이브러리를 빌드하고 npm에 배포합니다.
`bash
npm run build
npm version patch
npm publish
`
4. 프로젝트 업데이트: 라이브러리의 새로운 버전을 설치하여 프로젝트에서 변경된 스타일을 사용합니다.
`bash
npm update tfg-design-system
``