İçeriğe atla
ColliePWA

Temalar: bir görünüm seçin veya kendinizinkini getirin.

Bir tema, küçük bir JSON dosyasıdır. Renkleri, yazı tipini, şekli, görünümü ve bir terminal paletini taşır. ColliePWA bunlardan dördüyle birlikte gelir ve telefonunuzdaki bir dosyadan daha fazlasını içe aktarabilirsiniz.

01/Nedir

Bir tema, görünümlerden oluşan bir dosyadır.

Bir tema, uygulamanın renklerini biri açık yarı, diğeri koyu yarı için olmak üzere adlandırır. Ayrıca bir yazı tipi ailesi, başlıklar için bir yazı tipi, bir şekil, bir görünüm ve terminal yansımasının renklerini de adlandırabilir. Şekil ve görünüm; radius, shadow ve density gibi on kelimeden oluşur. Düzen, dokunma boyutları ve bir durumun anlamı olduğu gibi kalır, böylece blocked her temada yine blocked olarak kalır.

Bir dosyadaki her değer kapalı bir kelime veya denetlenmiş bir renktir. Dosya kod çalıştıramaz ve bir dosya, bir yazı tipi veya bir görsel yükleyemez.

Tema ve Görünüm iki ayrı ayardır. Tema, hangi renklerin kullanılacağını belirtir. Görünüm, hangi yarının gösterileceğini belirtir: Sistem, Açık veya Koyu.

02/Seçin

Ayarlar içinden bir tema seçin.

Ayarlar'ı, ardından Görünüm'ü açın ve bir temaya dokunun. Yeniden yükleme gerekmeden hemen uygulanır ve ColliePWA uygulamasını bir sonraki açışınızda ilk kare zaten o temada olur. Collie üzerine tek bir dokunuş varsayılanı geri getirir.

Bir yazı tipi belirten tema, yazı tipinizi bir kereliğine ayarlar. Daha sonra bunu Yazı tipi kartından değiştirebilirsiniz.

Collie

Yazı tipi: Aldrich

Bildiğiniz görünüm: nötr griler, metinler için Aldrich.

Nightwatch

Yazı tipi: IBM Plex Sans

flat · bold · strong · band · heavy

Gece nöbetteki telefon için. Gerçek siyah bir koyu yarı, düz ve kare, kalın çizgiler, loş bir kehribar vurgu ile üstbilginin ve çubukların arkasında loş bir kehribar şerit.

Terminal paleti

Daylight

Yazı tipi: Geist

Başlıklar: Atkinson Hyperlegible Next

round · lifted · roomy · gradient · cards · sentence

Parlak güneş ve az görenler için. AAA kontrastında gövde metni, yuvarlak geniş kartlar, alta doğru kayan bir sayfa ve kırmızıdan yeşile değil, maviden turuncuya uzanan durum renkleri.

Terminal paleti

Harbour

Yazı tipi: Atkinson Hyperlegible Next

Başlıklar: Space Grotesk

soft · lifted · grain · thin

Terminalden gelenler için. Tek bir turkuaz vurguya sahip soğuk mavi-gri, yumuşak köşeler, ince bir gren ve ince simgeler ile siyaha yakın bir mavi üzerinde Solarized tabanlı bir terminal paleti.

Terminal paleti

03/İçe aktarın

Dosyadan bir tema içe aktarın.

  1. 1Telefonunuza bir tema dosyası koyun. Dosya uzantısı .json olmalı ve boyutu 64 KiB değerinden küçük olmalıdır.
  2. 2Ayarlar içinde, Görünüm altındaki Tema kartını açın, İçe Aktar seçeneğine dokunun ve dosyayı seçin.
  3. 3Önizlemeyi inceleyin. Her iki yarının renklerini, şekli, terminal renklerini ve bir kontrast raporunu gösterir. Zayıf bir kontrast uyarı gösterir ve temayı yine de uygulayabilirsiniz. Kuralları çiğneyen bir dosya reddedilir ve hiçbir şey değişmez.

Bir tema uygulamanın nasıl göründüğünü değiştirir, başka hiçbir şeyi değiştirmez. Kod çalıştıramaz, dosya yükleyemez veya bir sunucuya erişemez.

Bir cihaz en fazla sekiz içe aktarılmış tema tutar. Bağlantı üzerinden içe aktarma yoktur ve temalar cihazlar arasında eşitlenmez.

04/Yazın

Kendinizinkini yazın.

En hızlı başlangıç, sunulan bir temadır. Temayı dışa aktarın, id ve name değerlerini değiştirin, renkleri, şekil kelimelerini veya terminal paletini düzenleyin ve tekrar içe aktarın. İçe aktarılan bir tema, sunulan bir temanın kimliğini kullanamaz.

Bu, kısaltılmış bir harbour.json, bir version 2 dosyasıdır. ... satırları dışarıda bırakılan kısımları temsil eder.

{
  "version": 2,
  "id": "harbour",
  "name": "Harbour",
  "author": "Collie",
  "light": {
    "background": "oklch(0.95 0.01 235)",
    "foreground": "oklch(0.26 0.025 250)",
    "card": "oklch(0.985 0.004 235)",
    "...": "..."
  },
  "dark": {
    "background": "oklch(0.21 0.018 250)",
    "foreground": "oklch(0.93 0.012 240)",
    "card": "oklch(0.255 0.02 252)",
    "...": "..."
  },
  "fonts": { "ui": "atkinson", "display": "grotesk" },
  "surface": {
    "radius": "soft",
    "shadow": "lifted",
    "density": "default",
    "weight": "default",
    "border": "default",
    "ground": "grain",
    "chrome": "page",
    "rows": "rules",
    "icons": "thin",
    "labels": "caps"
  },
  "ansi": {
    "0": "#073642",
    "1": "#f0504a",
    "2": "#859900",
    "...": "..."
  }
}

43 belirteç

Bir tema dosyası yalnızca dört gruptaki bu belirteçleri adlandırabilir. Başka herhangi bir anahtar içeren dosya reddedilir.

GrupNeyi boyarBelirteçler
Yüzeyler ve metin renkleri21Sayfa, kartlar, arayüz çerçevesi, metin, düğmeler, kenarlıklar ve odak halkası.
  • background
  • foreground
  • card
  • card-foreground
  • chrome
  • primary
  • primary-foreground
  • secondary
  • secondary-foreground
  • muted
  • muted-foreground
  • accent
  • accent-foreground
  • control-on
  • control-on-foreground
  • destructive
  • destructive-foreground
  • border
  • input
  • rule
  • ring
Durum6Ajan durumları ve bilgi rengi.
  • status-blocked
  • status-working
  • status-done
  • status-idle
  • status-unknown
  • status-info
Sözdizimi6Farklardaki ve koddaki metin renkleri.
  • syntax-keyword
  • syntax-string
  • syntax-constant
  • syntax-property
  • syntax-entity
  • syntax-comment
Ana bilgisayar kimliği10Makinelerinizi birbirinden ayıran renkler.
  • host-0
  • host-1
  • host-2
  • host-3
  • host-4
  • host-5
  • host-6
  • host-7
  • host-8
  • host-9

Şekil ve görünüm

surface bloğu on kelime tutar. Her biri kapalı bir listeden gelir ve dışarıda bıraktığınız bir belirteç varsayılanını, yani listesinin ilk kelimesini korur. Serbest bir sayı asla kabul edilmez, böylece bir tema bir dokunma boyutunu bozamaz.

radius
Bir kartın, bir satırın, bir alanın ve bir düğmenin köşesi.
  • sharp
  • soft
  • round
shadow
Yükseltilmiş panellerin altındaki gölge.
  • default
  • flat
  • lifted
density
Denetimlerin içinde ve arasında ne kadar alan bulunduğu.
  • default
  • roomy
weight
Medium ve semibold metnin ne kadar kalın çizileceği.
  • default
  • bold
border
Çok ince bir çizginin genişliği.
  • default
  • strong
ground
Her şeyin arkasındaki sayfa: düz, yumuşak bir gradyan veya ince bir gren.
  • flat
  • gradient
  • grain
chrome
Üstbilgi ve çubuklar: sayfa renginde veya kendilerine ait bir şerit üzerinde.
  • page
  • band
rows
Çizgiler içeren tek bir çerçeveli grup olarak veya her satır için bir kart olarak bir liste.
  • rules
  • cards
icons
Her simgenin çizgi genişliği.
  • default
  • thin
  • heavy
labels
Büyük harflerle veya tümce düzeninde küçük bölüm etiketleri.
  • caps
  • sentence

Terminal paleti

ansi bloğu 18 renk içerir veya hiç içermez: 16 terminal rengi, ink ve ground. Her biri #rrggbb veya oklch(L C H) biçimindedir ve her biri bir denetimden geçer.

Değerler
Değer bir renktir: #rrggbb, #rrggbbaa veya opaklık için / A ile birlikte oklch(L C H). L 0 ile 1, C 0 ile 0.5 ve H 0 ile 360 arasında değişir; tümü yalın sayılardır.
Yarılar
light, dark veya her ikisini birden verin. Dışarıda bıraktığınız bir yarı, belirteç belirteç Collie üzerinden doldurulur.
Yazı tipleri
İsteğe bağlı fonts.ui, ColliePWA paketinde bulunan yazı tiplerinden birini adlandırır. İsteğe bağlı fonts.display, başlıklar için olanı adlandırır. Başka hiçbir yazı tipi kabul edilmez.
Neler reddedilir
Liste dışındaki bir anahtar, 1 veya 2 dışında bir version, bir renk veya bir şekil kelimesi olmayan bir değer, var(), url() veya başka bir fonksiyon, sunulan bir temanın kimliği ve 64 KiB üzerindeki bir dosya. İleti nedeni belirtir ve hiçbir şey uygulanmaz.
Sürüm
version değeri 1 veya 2'dir. Bir surface bloğu, bir fonts.display yazı tipi veya bir ansi bloğu içeren dosya 2 belirtir. Sürüm 2 olan bir dosya ColliePWA 1.22.0 veya daha yenisini gerektirir.

05/Paylaşın

Dışa aktarın ve paylaşın.

Dışa aktarma işlemi, etkin temayı bir .collie-theme.json dosyası olarak yazar. Bunu birine gönderin veya bir depoda saklayın; onlar da temayı sizin içe aktardığınız yöntemle içe aktarırlar.

Ayrıntılar Temalar içinde