🎨
UI/UX

Sistem tem

Skrbniške nastavitve

Svetle, temne in sistemske teme z gladkimi prehodi

Pregled

Popoln sistem tematiranja z lastnostmi po meri CSS. Podpira svetle, temne in sistemske nastavitve. Uporabniška izbira je ostala v piškotkih. Čudovite animacije prehodov med načini.

Premisleki glede oblikovanja

Vzorci UX in opombe o vizualnem oblikovanju za to funkcijo:

  • Temni način niso le obrnjene barve – je celoten utrip
  • Preizkusite kontrastna razmerja v obeh načinih (najmanj WCAG AA)
  • Trajanje prehoda: 200–300 ms se zdi naravno
  • Sistemski način upošteva uporabnikove nastavitve OS

Ključne prednosti

Po čem ta funkcija izstopa:

  • Trije načini: svetlo, temno, sistem
  • Brez bliskavice ob nalaganju strani
  • Spremenljivke CSS za enostavno prilagajanje
  • Več stilov pripomočkov (lebdeči, spustni, preklopni)
Tehnična opomba

ThemeHelper upravlja stanje. CSS uporablja izbirnik [data-theme="dark"]. Gradnik se upodobi v glavi prek params['header']['widgets']['theme'].

Pomočniki
ThemeHelper

Konfiguracija

Legenda razmerja konfiguracije
DB preglasi params.php🔗 Nastavitev, povezana z DB📋 DB hrani samo vrednost
params.php Konfiguracija

Konfiguracijska pot: params['theme']

params['theme']['default'] => 'system'params['theme']['enableTransition'] => trueparams['theme']['persistChoice'] => trueparams['theme']['widget']['type'] => 'floating'params['theme']['widget']['position'] => 'top-right'
Nastavitve baze podatkov (tabela system_setting)
KljučVrstaOpisRazmerje
default_themestringDefault theme (light/dark/system)