Başlarken

Giriş

Ladom UI, React için Ladom tasarım sistemidir: Ladom UI Figma dosyasıyla birebir kurulmuş tasarım tokenları, ikonlar ve bileşenler.

İlkeler

Doğruluk kaynağı Figma’dır. Renkler, yazı, boşluklar, köşe yarıçapları, derinlik ve hareket Figma’daki variable ve stillerden gelir. Kodda hiçbir şey uydurulmaz.
Her şey bir token’dır. Bileşenler hiçbir görsel değeri sabit yazmaz; var(--color-primary) ya da var(--text-ui-title) gibi CSS değişkenleri kullanır.
Sade React ve CSS. Bileşenler framework’ten bağımsız React ve CSS Modules ile yazılır. Tailwind ya da çalışma zamanında stil üretimi yoktur.
Her anlam için tek ikon. Her ikon adı tek bir ikona karşılık gelir; bir üründe üç farklı telefon ikonu kullanılmaz.

Paketler

@ladom/tokens: CSS değişkeni olarak tasarım tokenları; Açık/Koyu tema, Masaüstü/Tablet/Mobil değerleri ve Comfort/Narrow yoğunluğu. Bkz. Temeller.
@ladom/icons: anlamlı adlarla ikon bileşenleri. Bkz. İkonlar.
@ladom/ui: React bileşenleri. Şu an yapılıyorlar ve bu siteye tek tek eklenecekler.

Modlar

Modlar <html> üzerindeki özniteliklerle seçilir. Cihaz değerleri ekran genişliğini izler (768px altı Mobil, 1280px altı Tablet) ve data-device ile zorlanabilir. Koyu tema data-theme="dark", Narrow yoğunluk data-density="narrow" ile açılır.

Sonraki adımlar

Kurulum ile devam edin.