Hallo Norbert,
sorry dass ich erst jetzt antworte, hatte die letzte Woche viel um die Ohren.
Hier eine angepasste Version, den bisherigen Code bitte folgendermaßen ersetzen:
Folgender Code muss auf die Startseite bzw. die Seite mit dem Button für den Darkmode in ein Quelltext-Widget:
<
!
-- Eigener Darkmode (Startseite) -->
<
p>
<
a href="#" class="button" id="enable_dark_mode" data-text-disable="Dunkelmodus deaktiveren">
<
span>
Dunkelmodus aktivieren<
/span>
<
/a>
<
/p>
<
script>
(function() {
var button = document.
getElementById("enable_dark_mode");
var buttonText = button.
querySelector('span');
function checkDarkmode() {
if (localStorage.
getItem('darkmode')) {
DarkReader.
setFetchMethod(window.
fetch); // avoid CORS warnings with google fonts etc.
DarkReader.
enable(window.
$custom_darkmode_config);
button.
setAttribute("data-text-enable", buttonText.
innerHTML);
buttonText.
innerHTML = button.
getAttribute("data-text-disable");
} else {
DarkReader.
disable();
if (button.
getAttribute("data-text-enable")) {
buttonText.
innerHTML = button.
getAttribute("data-text-enable");
}
}
}
button.
addEventListener("click", () => {
if (localStorage.
getItem('darkmode')) {
localStorage.
removeItem('darkmode');
} else {
localStorage.
setItem('darkmode', 'on');
}
checkDarkmode();
});
checkDarkmode();
})();
<
/script>
<
!
-- Ende eigener Darkmode (Startseite) -->
Und dieser Code muss in Erweitert > Attribute > mobile_script:
<
!
-- Eigener Darkmode JavaScript -->
<
script>
window.
$custom_darkmode_config = {
brightness: 100,
contrast: 90,
sepia: 10
};
document.
addEventListener('DOMContentLoaded', function() {
if (localStorage.
getItem('darkmode')) {
DarkReader.
setFetchMethod(window.
fetch); // avoid CORS warnings with google fonts etc.
DarkReader.
enable(window.
$darkmode_config);
} else {
DarkReader.
disable();
}
});
<
/script>
<
!
-- Ende eigener Darkmode JavaScript -->
VG
