This repository has been archived on 2025-04-21. You can view files and clone it, but you cannot make any changes to it's state, such as pushing and creating new issues, pull requests or comments.
FalixNodes-Desktop-NP/public/scripts/theme.js
2025-03-22 22:04:43 -04:00

49 lines
No EOL
2.3 KiB
JavaScript
Executable file

let AppTheme = localStorage.getItem('AppTheme')
if (AppTheme == null) {Theme('Dark')} else {Theme(AppTheme)}
function Theme(theme) {
if (theme === 'Auto') {
document.querySelector('html').setAttribute('theme', 'auto')
setTimeout(() => {ThemeIsAuto()}, 200)
} else if (theme === 'Light') {
document.querySelector('html').setAttribute('theme', 'light')
setTimeout(() => {ThemeIsLight()}, 200)
} else if (theme === 'Dark') {
document.querySelector('html').setAttribute('theme', 'dark')
setTimeout(() => {ThemeIsDark()}, 200)
}
localStorage.setItem('AppTheme', theme)
}
function ThemeIsReset() {
document.querySelector(".theme #auto").setAttribute('class', 'theme')
document.querySelector(".theme #auto").style.border = '1px rgba(255, 255, 255, 0.1) solid'
document.querySelector(".theme #auto > p").style.color = 'gray'
document.querySelector(".theme #light").setAttribute('class', 'theme')
document.querySelector(".theme #light").style.border = '1px rgba(255, 255, 255, 0.1) solid'
document.querySelector(".theme #light > p").style.color = 'gray'
document.querySelector(".theme #dark").setAttribute('class', 'theme')
document.querySelector(".theme #dark").style.border = '1px rgba(255, 255, 255, 0.1) solid'
document.querySelector(".theme #dark > p").style.color = 'gray'
}
function ThemeIsAuto() {
ThemeIsReset()
document.querySelector(".theme #auto").setAttribute('class', 'theme theme-active')
document.querySelector(".theme #auto").style.border = '1px var(--TabActiveBackground) solid'
document.querySelector(".theme #auto > p").style.color = 'var(--TabActiveBackground)'
}
function ThemeIsLight() {
ThemeIsReset()
document.querySelector(".theme #light").setAttribute('class', 'theme theme-active')
document.querySelector(".theme #light").style.border = '1px var(--TabActiveBackground) solid'
document.querySelector(".theme #light > p").style.color = 'var(--TabActiveBackground)'
}
function ThemeIsDark() {
ThemeIsReset()
document.querySelector(".theme #dark").setAttribute('class', 'theme theme-active')
document.querySelector(".theme #dark").style.border = '1px var(--TabActiveBackground) solid'
document.querySelector(".theme #dark > p").style.color = 'var(--TabActiveBackground)'
}