Enable Auto Detect for Light/Dark Mode
Open WHMCS > templates > digit > wdes > js / customizer.js
at the end of the file add the following code
/***** Auto Detect System Mode (Light or Dark) *****/
if (
window.matchMedia &&
window.matchMedia("(prefers-color-scheme: dark)").matches
) {
document
.querySelector("link[href*='theme']")
.setAttribute(
"href",
`${whmcsBaseUrl}/templates/${templateName}/css/theme-dark.css`
);
}
if (
window.matchMedia &&
window.matchMedia("(prefers-color-scheme: light)").matches
) {
document
.querySelector("link[href*='theme']")
.setAttribute(
"href",
`${whmcsBaseUrl}/templates/${templateName}/css/theme-light.css`
);
if (document.querySelector("link[href*='form-theme']") != null) {
document
.querySelector("link[href*='form-theme']")
.setAttribute(
"href",
`${whmcsBaseUrl}/templates/orderforms/digit/css/form-theme-light.css`
);
}
// Change image Path from Dark to Light
if (document.querySelector(".logo img") != null) {
document
.querySelector(".logo img")
.setAttribute(
"src",
`${whmcsBaseUrl}/templates/${templateName}/img/theme-light-logo.png`
);
}
if (document.querySelector(".domain-bg") != null) {
document
.querySelector(".domain-bg")
.setAttribute(
"src",
`${whmcsBaseUrl}/templates/${templateName}/img/theme-light-domain-bg.png`
);
}
}