Implement darkmode using stimulus.

This commit is contained in:
Jan Böhmer 2022-07-30 00:33:22 +02:00
parent 671e0944a2
commit 8ccf5652ab
3 changed files with 44 additions and 21 deletions

View file

@ -50,6 +50,7 @@ import "./tristate_checkboxes";
//Define jquery globally
window.$ = window.jQuery = require("jquery")
/**
require('bootstrap-select');
@ -95,25 +96,6 @@ require('../ts_src/ajax_ui');
require('../ts_src/event_listeners');
//Register darkmode (we must do it here, TS does not support ES6 constructor...
try {
//The browser needs to support mix blend mode
if(typeof window.getComputedStyle(document.body).mixBlendMode !== 'undefined') {
const darkmode = new Darkmode();
$(document).on("ajaxUI:start ajaxUI:reload", function () {
//Show darkmode toggle to user
$('#toggleDarkmodeContainer, #toggleDarkmodeSeparator').removeAttr('hidden');
$('#toggleDarkmode').prop('checked', darkmode.isActivated());
$('#toggleDarkmode').change(function () {
darkmode.toggle();
});
});
}
} catch (e) {
//Ignore all errors (for compatibiltiy with old browsers)
}
//Start AjaxUI AFTER all event has been registered
//$(document).ready(ajaxUI.start());