Temalar

Çift tema

Çift tema kapalıyken site yalnızca açık token’ları kullanır. Açıkken ziyaretçiler geçiş yapabilir ve koyu token’lar uygulanır.

Hazır temalar

Bir hazır tema, token’larını açık yuvaya, koyu yuvaya veya tek temaya kopyalar. get_theme sourceLightDefaultThemeId, sourceLightDefaultThemeName ve koyu çifti döner. Hazır tema uygulamak sayfa geçişlerini silmez.

Token katmanları

Token’lar tema düzenleyicisini izler. Sayfa: arka plan renkleri (page, surface, surfaceMuted, elevated, overlay), aralık (xs, sm, md, lg, xl, xl2, xl3), blok dolgusu ve satır içi dolgu (none, xs, sm, md, lg, xl). Metin: metin renkleri (primary, secondary, muted, inverse, link, linkHover), yazı tipi aileleri (body, heading, mono) ve her biri için isteğe bağlı typography.fontFace dosyası (url, family, weight, style; woff2, woff, ttf veya otf; dosya yoksa mevcut aile metni kalır), yazı boyutları (xs–xl3), yazı kalınlıkları (normal, medium, semibold, bold) ve satır yükseklikleri (tight, normal, relaxed). Öğeler: vurgu renkleri (primary, primaryHover, secondary), kenarlık renkleri (default, subtle, strong, focus), kenarlık kalınlıkları (none, sm, md, lg), köşe yarıçapları (none, sm, md, lg, xl, full) ve gölgeler (none, sm, md, lg, xl, inner). Kaydırma çubuğu: width, track, thumb, thumbHover ve radius.

CSS değişkenleri

Her token, --site- öneki ve noktaları tireye çevrilmiş yolu ile yayınlanır. colors.accent.primary, --site-colors-accent-primary olur.

Bloklar token’ları nasıl kullanır

Bloklar ham tema CSS’i saklamaz. Yazı tipi ailesi theme-heading, theme-body veya theme-mono değeridir; bunlar typography.fontFamily.heading, .body ve .mono değerlerini okur. typography.fontFace o yuva için dosya ve aile adı içerdiğinde tema stil sayfası @font-face üretir ve yazı tipi değişkenini yüklenen aileye çevirir. Dolgu, kenarlık kalınlığı ve köşe yarıçapı alanları ölçek anahtarları saklar (none, sm, md, lg ve ölçeğinde varsa xl veya full). Bu anahtarlar padding.block, padding.inline, border.width ve border.radius değerlerine çözülür. Dolu butonlar colors.accent.primary kullanır.

Tema durumunu, pageTransition ve kaynak hazır tema kimlikleri dahil okuyun.

GET /api/v1/{locale}/{websiteId}/theme

Tema ayarlarını değiştirin.

PUT /api/v1/{locale}/{websiteId}/theme

Yazmalar

lightTokens, darkTokens, dualThemeEnabled veya bunların herhangi bir birleşimini gönderin. Token nesnesi kayıtlı haritaya birleşir; gönderilmeyen anahtarlar kalır. Geçersiz bir değer token yolunu adlandırır, örneğin lightTokens.colors.accent.secondary. Gönderilmeyen harita olduğu gibi kalır. dualThemeEnabled tek başına gönderilebilir.

Sayfa geçişleri

Sayfa geçişlerini tema düzenleyici kaydeder. type değeri none, fade, slide, slideUp veya zoom olur. durationMs 100–1000 arasındadır. easing değeri linear, ease, easeIn, easeOut veya easeInOut olur. get_theme pageTransition döner. save_theme bunu kabul etmez.

MCP: get_theme, save_theme.