Add a feature that allows auto change the theme based on time or OS' preference

This commit is contained in:
Alfredo Vanegas 2022-01-21 21:34:23 -06:00
parent 3d9923e7a0
commit 83146b339e
2 changed files with 25 additions and 0 deletions

View File

@ -46,3 +46,21 @@ themeToggle.addEventListener('click', () => {
if (CONFIG.imageBackground) {
document.body.classList.add('withImageBackground');
}
if(CONFIG.changeThemeByOS && CONFIG.autoChangeTheme) {
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
enableDark();
} else {
disableDark();
}
}
if(CONFIG.changeThemeByHour && CONFIG.autoChangeTheme) {
const date = new Date();
const currentTime = date.getHours().toString() + ':' + date.getMinutes().toString()
if(currentTime >= CONFIG.hourDarkThemeActive) {
enableDark();
} else if (currentTime >= CONFIG.hourDarkThemeInactive) {
disableDark();
}
}

View File

@ -32,6 +32,13 @@ const CONFIG = {
defaultLatitude: '37.775',
defaultLongitude: '-122.419',
// Autochange dark-theme (24hrs format)
autoChangeTheme: true,
changeThemeByOS: false,
changeThemeByHour: true,
hourDarkThemeActive: '19:00',
hourDarkThemeInactive: '7:00',
// ┌─┐┌─┐┬─┐┌┬┐┌─┐
// │ ├─┤├┬┘ ││└─┐
// └─┘┴ ┴┴└──┴┘└─┘