added dark mode to login theme (#32226)
* added dark mode to login theme fixes: #26178 Signed-off-by: Erik Jan de Wit <erikjan.dewit@gmail.com> * Update themes/src/main/resources/theme/keycloak.v2/login/template.ftl Co-authored-by: Jon Koops <jonkoops@gmail.com> Signed-off-by: Erik Jan de Wit <edewit@redhat.com> --------- Signed-off-by: Erik Jan de Wit <erikjan.dewit@gmail.com> Signed-off-by: Erik Jan de Wit <edewit@redhat.com> Co-authored-by: Jon Koops <jonkoops@gmail.com>
This commit is contained in:
parent
9a1af138a1
commit
97d29bc14f
1 changed files with 15 additions and 0 deletions
|
@ -48,6 +48,21 @@
|
||||||
checkCookiesAndSetTimer(
|
checkCookiesAndSetTimer(
|
||||||
"${url.ssoLoginInOtherTabsUrl?no_esc}"
|
"${url.ssoLoginInOtherTabsUrl?no_esc}"
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const DARK_MODE_CLASS = "pf-v5-theme-dark";
|
||||||
|
const mediaQuery =window.matchMedia("(prefers-color-scheme: dark)");
|
||||||
|
updateDarkMode(mediaQuery.matches);
|
||||||
|
mediaQuery.addEventListener("change", (event) =>
|
||||||
|
updateDarkMode(event.matches),
|
||||||
|
);
|
||||||
|
function updateDarkMode(isEnabled) {
|
||||||
|
const { classList } = document.documentElement;
|
||||||
|
if (isEnabled) {
|
||||||
|
classList.add(DARK_MODE_CLASS);
|
||||||
|
} else {
|
||||||
|
classList.remove(DARK_MODE_CLASS);
|
||||||
|
}
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue