Skip to Content
ν”„λ ˆμž„μ›Œν¬ ν†΅ν•©κ°œμš”

ν”„λ ˆμž„μ›Œν¬ 톡합 κ°€μ΄λ“œ

Inkio μ—λ””ν„°λŠ” ν”„λ ˆμž„μ›Œν¬μ— λ…λ¦½μ μž…λ‹ˆλ‹€. μ–΄λ–€ React UI λΌμ΄λΈŒλŸ¬λ¦¬μ™€λ„ ν•¨κ»˜ μ‚¬μš©ν•  수 μžˆμŠ΅λ‹ˆλ‹€.

μ•„λž˜ κ°€μ΄λ“œμ—μ„œλŠ” 각 ν”„λ ˆμž„μ›Œν¬μ—μ„œ Inkioλ₯Ό ν†΅ν•©ν•˜λŠ” 방법을 μ½”λ“œ μ˜ˆμ œμ™€ ν•¨κ»˜ μ„€λͺ…ν•©λ‹ˆλ‹€.

  • Mantine β€” Mantine UI μ»΄ν¬λ„ŒνŠΈμ™€ ν•¨κ»˜ μ‚¬μš©
  • Radix UI β€” Radix Themes와 ν•¨κ»˜ μ‚¬μš©
  • Tailwind CSS β€” Tailwind μœ ν‹Έλ¦¬ν‹° 클래슀둜 λž˜ν•‘

핡심 원칙

  1. CSS μž„ν¬νŠΈ μˆœμ„œκ°€ μ€‘μš”ν•©λ‹ˆλ‹€ β€” ν”„λ ˆμž„μ›Œν¬ CSSλ₯Ό λ¨Όμ €, Inkio CSSλ₯Ό λ‚˜μ€‘μ— μž„ν¬νŠΈν•˜μ„Έμš”.
  2. EditorλŠ” 래퍼 μ•ˆμ— 배치 β€” ν”„λ ˆμž„μ›Œν¬μ˜ Card, Container λ“±μœΌλ‘œ 감싸면 λ©λ‹ˆλ‹€.
  3. ν…Œλ§ˆ 연동 β€” ν”„λ ˆμž„μ›Œν¬μ˜ ν…Œλ§ˆ providerμ—μ„œ colorSchemeμ΄λ‚˜ appearanceλ₯Ό Inkio의 .dark ν΄λž˜μŠ€μ™€ λ§žμΆ”μ„Έμš”.
Last updated on