Hi all.
I'm aware of the new dynamic UI theme management but there's a problem.
I could decide to persist my preferred UI theme at server side (i.e. on a DB table), so that next time I sign in the application my favourite theme is automagically restored (*even* if I'm logging in from a brand new device, i.e. a smartphone).
Steps are:
// Class definition
var KTThemeMode = function () {
...
var getMode = function() {
var modeParam = getParamName("value");
var menuMode = getMenuMode();
if ( localStorage.getItem(modeParam) !== null ) {
return localStorage.getItem(modeParam);
}
if ( element.hasAttribute("data-theme") ) {
return element.getAttribute("data-theme");
}
// Class definition
var KTThemeMode = function () {
...
var getMode = function() {
var modeParam = getParamName("value");
var menuMode = getMenuMode();
if ( element.hasAttribute("data-theme") ) {
return element.getAttribute("data-theme");
}
if ( localStorage.getItem(modeParam) !== null ) {
return localStorage.getItem(modeParam);
}
Hi,
Can you please replace KTThemeMode with this version and use the below theme mode init script:
<!--begin::Theme mode setup on page load-->
<script>
var defaultThemeMode = "light";
var themeMode;
if ( document.documentElement ) {
if ( document.documentElement.hasAttribute("data-theme-mode")) {
themeMode = document.documentElement.getAttribute("data-theme-mode");
} else {
if ( localStorage.getItem("data-theme") !== null ) {
themeMode = localStorage.getItem("data-theme");
} else {
themeMode = defaultThemeMode;
}
}
if (themeMode === "system") {
themeMode = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
}
document.documentElement.setAttribute("data-theme", themeMode);
}
</script>
<!--end::Theme mode setup on page load-->
data-theme-mode="light"
attribute to the HTML root element to set user defined theme mode instead of saving it in the browser storage.Maybe you should consider a data-kt-preferred-theme (or data-kt-default-theme) to let the user specify what the default theme should be (in case there isn't any cookie) and use it inside KTThemeMode? It should work...