Seiten
Inhalt
2. Theme Switcher
Das Theme-Package erkennt automatisch, wie viele Themes erlaubt sind (theme.allow in xpulse.json).
Verhalten je nach Konfiguration
| Anzahl erlaubter Themes | Verhalten |
|---|---|
| 1 Theme | Kein Switcher wird angezeigt |
Genau 2 Themes (dark + light) |
Eleganter Mond/Sonne Toggle-Switch |
| Mehr als 2 Themes | Dropdown mit Theme-Namen |
Beispiel: Toggle-Switch (dark + light)
| {% themeSwitcher() %} |
Visuelles Ergebnis:
Ein minimaler Slider mit Mond links und Sonne rechts. Bei Hover erscheint ein Tooltip.
Konfiguration in `xpulse.json`:
| { |
| "theme": { |
| "default": "dark", |
| "allow": ["dark", "light", "mein-theme"] |
| } |
| } |
Anti-FOUC Schutz
Das Theme wird bereits im <head> gesetzt, bevor das CSS geladen wird. Kein Flackern beim Laden.