Görünüm
Görünüm
Nesnelerin nasıl çizildiği, renk ve yoğunluk belirlendikten sonra: köşeler, derinlik, çizgiler. Bu belirteçler, temanın `görünüm` eksenidir — varsayılan görünüm, bu sayfanın gösterdiği şeydir ve başka bir görünüm, aynı isimleri ayarlayan başka bir dosyadır, aşağıda değişmesi gereken bir şey yoktur.
Köşe yuvarlaklığı
Hiçbiri yok, sonra her biri bir altının iki katı olan dört adım, sonra bir hap. İki adım arası, ölçek üzerinde nerede durursanız durun aynı mesafedir, bu da okunabilirliği sağlar. İlk adım kasıtlı olarak neredeyse yoktur: bu, düz bir görünümün istediği şeydir; gerçek bir dik açı bitmemiş gibi görünür. Son adımın daha yuvarlak olanı, bir daire olmak isteyen bir şekildir ve bunu kendisi söyler — bir daire, bir görünüm kararı değildir.
--radius-0
--radius-1
--radius-2
--radius-3
--radius-4
--radius-pill
Köşe yuvarlaklığı rolleri
Bir şekil, yukarıdaki ölçeği okumaz: oynadığı rolü okur ve görünüm, o rolün hangi adımı alacağını belirtir — asla bir adımın ne kadar değerinde olduğunu değil, bu da ölçeğin aynı anda iki anlam taşımasına neden olur. Bir şeyi tutan bir kutudur; ister metin, içerik ya da mesaj tutuyor olsun; bir sayfanın iki bölgesini ayıran ne de odur, ne de hiçbir şeyi yuvarlatır. Görünümü `yumuşak` olarak değiştirin ve bir kontrol parçasının geri kalanından ayrıldığını görün: bir kapsül, bir satır yüksekliğindeki bir şey için uygundur ve bir metin alanı için absürt.
--radius-control
bir satır yüksekliğinde ve basılmış
--radius-box
bir şeyi tutar
--radius-media
resimler ve figürler
--radius-pill
kapsül olarak okunan şey
Gölgeler
Bir saç teli kalınlığında kaldırmadan, bir yüzer panele kadar dört derinlik. Düz bir dünya isteyen bir görünüm, hepsini sıfıra ayarlar ve her yükseltilmiş yüzey buna uyar.
--shadow-1
--shadow-2
--shadow-3
--shadow-4
Sınırlar
Çizgi kendisi — kalınlığı ve tarzı. Rengi burada yoktur: bu, renk şemasına aittir; bu da bir görünümün, ne renginin olacağını bilmeden bir çizgiyi kaldırmasına olanak tanır.
--border-discreet
--border-default
--border-focus
--border-placeholder
Ayrıcılar ve bölgeler
Şeyleri ayıran iki çizgi: bir şeyin iki sırası arasında ve bir sayfanın iki bölgesi arasında. Yirmi kadar şekil ilkini okur, bu yüzden bu bir belirteçtir ve bir kural değildir.
--border-separator — diğerleri arasında bir sıradiğerleri arasında bir sıra
diğerleri arasında bir sıra
--border-region — böyle sınırlı bir sayfa bölgesi