Bir dosya için tema seçin
Yeni ekranlar için temayı ve görünümü, bir dosyanın içindeki istem oluşturucudan seçin. Tema düğmesi, Home sayfasındaki istem kutusunda kullanılamaz.1
Tema menüsünü açın
İstem oluşturucuda tema düğmesine tıklayın. Düğme, geçerli temanın renk örneğini gösterir. Tema Automatic olduğunda ise bir renk çarkı gösterir. Menünün başlığı Theme for new screens olur.
2
Bir tema seçin
Automatic seçin, organizasyonunuzun temalarından birini seçin (ilk sırada listelenir) ya da yerleşik bir tema seçin: Default, Blue, Grayscale, Green, Ice, Orange, Red, Rose, Violet veya Yellow.
3
Bir görünüm seçin
Appearance altında Light veya Dark seçin. Ya da Flowstep’in her ekranı isteminize göre belirlemesi için Automatic seçin. Örneğin “koyu bir gösterge paneli” koyu olarak çıkar.
Seçiminiz, bir sonra oluşturacağınız ekranlara uygulanır. Tuvaldeki mevcut ekranlar görünümünü korur.
Flowstep’in bir tema tasarlamasına izin verin
Bir dosyanın henüz teması yoksa, yani tema Automatic bırakılmış yeni bir dosyaysa, Flowstep ilk oluşturduğu ekranlarla birlikte özel bir tema tasarlar. Çalışırken sohbette bir Designing theme adımı görürsünüz. Flowstep temayı şunlardan oluşturur:- İsteminizde adlandırdığınız renkler
- Tasarım yönergelerinizdeki renkler
- Eklerdeki ve yapıştırdığınız bağlantılardaki marka renkleri
- Başka daha belirli bir bilgi yoksa, isteminizin tanımladığı ürün ve ruh hali
Tek bir ekranın temasını değiştirin
Dosyanın geri kalanına dokunmadan tek bir ekranı yeniden biçimlendirmek için:- Tuvalde ekranı seçin.
- Ekranın üstündeki menüde Theme düğmesine tıklayın.
- Organizasyonunuzun temalarından birini ya da yerleşik bir temayı seçin veya Light ile Dark arasında geçiş yapın.
Bir temayı düzenleyin
Home sayfasındaki Themes bölümünden bir temayı açın. Tema düzenleyicisi temanın canlı önizlemesini ve sağda Theme settings panelini gösterir. Önizlemeyi değiştirmek için üstteki Light ve Dark düğmelerini kullanın. Temanın adına tıklayarak adını değiştirebilirsiniz.- Colors — her renk grubunun açık için bir, koyu için bir renk örneği vardır: Primary, Secondary, Accent, Muted, Destructive, Background, Card, Popover, Border, Input, Ring, Charts ve Sidebar. Düzenlemek için bir örneğe tıklayın. Örneğin bir grubun dolgu ve metin renklerini renk seçiciyle veya hex değeriyle değiştirebilirsiniz.
- Radius — bir yuvarlaklık adımı seçin (Square, Slight, Balanced, Soft veya Round). Ya da Custom seçip kendi değerinizi belirlemek için Base radius değerini sürükleyin.
- Temayı kullanan her ekranı güncellemek için Publish düğmesine tıklayın. Flowstep, “Published. Screens using this theme are updating.” (Yayımlandı. Bu temayı kullanan ekranlar güncelleniyor.) mesajıyla onaylar.
- Yayımlanmamış değişikliklerinizi silmek için Reset changes düğmesine tıklayın. Temayı kullanan ekranlar etkilenmez.
Organizasyondaki Guest (misafir) dışındaki herkes temaları düzenleyebilir ve silebilir.
Renkleri ve köşeleri temanıza bağlayın
Renkler ve köşeler, sabit bir değer yerine bir tema belirtecine işaret edebilir. Bağlı bir değer ekranın temasını izler. Bu nedenle tema değiştiğinde (farklı bir tema, yayımlanmış bir düzenleme veya açık ile koyu arasında geçiş) bağlı renkler ve köşeler de onunla birlikte güncellenir. Colors: Fill veya Border panelinde renk örneğine tıklayın. Token sekmesinde Theme, Base veya Tailwind gruplarından bir belirteci arayın veya seçin. Tam bir renk istiyorsanız Custom sekmesini kullanın. Bağlı bir renk, panelde belirteç adını gösterir. Yine de opaklığını ayarlayabilirsiniz. Corners: Corners panelinde bir köşe önizlemesine tıklayın. Token sekmesinde bir adım seçin (örneğinmd veya lg). Custom sekmesinde piksel cinsinden tam bir değer yazın. Bağlı bir köşe belirteç adını gösterir. Temanın yuvarlaklığını değiştirirseniz köşe de yeniden yuvarlanır.
Bağlı bir değeri sabit bir değere geri döndürmek için Detach from token düğmesine tıklayın. Renk veya köşe mevcut görünümünü korur, ancak artık temayı izlemez.
İyi bilmeniz gerekenler
- Ekranlar kendi temalarını korur: Her ekran temasını ve görünümünü hatırlar. Dosyanın temasını değiştirmek yalnızca bir sonra oluşturacağınız ekranları etkiler. Mevcut ekranları yeniden biçimlendirmek için ekran başına Theme menüsünü kullanın.
- Yalnızca yayımlanmış sürümler: Ekranlar bir temanın yayımlanmış sürümünü gösterir. Taslaklar, siz yayımlayana kadar yalnızca tema düzenleyicisinde görünür.
- Belirteç bağlantıları düzenlemelerden sonra da kalır: Gölgelerde, filtrelerde ve gradyanlarda kullanılan tema renkleri, Flowstep bir ekranı düzenlediğinde veya yeniden oluşturduğunda temaya bağlı kalır.
- Ölçeklenmeyen yuvarlaklık adımları:
nonevefullköşe belirteçleri, temanın yuvarlaklığı ne olursa olsun her zaman sırasıyla kare ve tamamen yuvarlaktır.