feat(themes): Theme-Wechsel mit View-Transition-Cross-Fade am Ausloeser

This commit is contained in:
2026-06-13 20:30:56 +02:00
parent a6d14f9267
commit 2bdee5f215
+18 -1
View File
@@ -23,6 +23,23 @@ function closeThemeModal() {
overlay.classList.remove('active');
}
/**
* Wechselt das Theme mit nativem Cross-Fade (View Transitions API).
* Wrap sitzt bewusst hier am User-Ausloeser, NICHT in applyTheme(),
* sonst fadet jeder neue Tab beim Initial-Load (settings.js:101).
* Feature-Detection-Fallback: aeltere Browser (z.B. Firefox < 144)
* schalten instant um, ohne Bruch.
* @param {string} name - Theme-Name
*/
function switchTheme(name) {
const swap = () => applyTheme(name, false); // false: Theme-BG anwenden (kein User-bgUrl-Schutz hier noetig, bgUrl wurde geleert)
if (document.startViewTransition) {
document.startViewTransition(swap);
} else {
swap();
}
}
/**
* Prueft ob eine Background-URL sicher fuer CSS-Einbettung ist.
* Erlaubt nur blob: und data:image/ Protokolle (aus File Upload).
@@ -129,7 +146,7 @@ function bindSettingsEvents() {
settings.theme = name;
settings.bgUrl = '';
document.getElementById('bgUrlInput').value = '';
applyTheme(name, false);
switchTheme(name);
await saveSettings();
});
});