GithubMirrors/cardconjurer
1
0
Fork 1
mirror of https://github.com/Investigamer/cardconjurer.git synced 2025-07-26 21:04:58 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

theme editor

Browse Source
This commit is contained in:
Kyle
2020-12-24 17:31:50 -08:00
parent b49ba36450
commit aac1b64898
7 changed files with 140 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
js/themes.js Normal file
View File

@@ -0,0 +1,44 @@
var theme, rainbowTimer;
const root = document.documentElement.style;
if (localStorage.getItem('theme')) {
theme = JSON.parse(localStorage.getItem('theme'));
updateCSS();
} else {
resetTheme();
}
function updateCSS() {
if (!root.getPropertyValue('--site-background').includes(theme.background)) {
root.setProperty('--site-background', 'url("' + (theme.background || '/img/lowpolyBackground.svg') + '")');
}
// root.setProperty("--color-primary", theme.SOMETHING);
// root.setProperty("--color-selected", theme.SOMETHING);
// root.setProperty("--color-highlighted", theme.SOMETHING);
// root.setProperty("--font-color", theme.SOMETHING);
// root.setProperty("--font-color-2", theme.SOMETHING);
// root.setProperty("--input-background", theme.SOMETHING);
// root.setProperty("--input-background-selected", theme.SOMETHING);
if (theme.rainbow > 0) {
clearInterval(rainbowTimer);
rainbowTimer = setInterval(rainbowMode, (theme.rainbow));
} else {
clearInterval(rainbowTimer);
root.setProperty('--regular-backdrop-filter', 'hue-rotate(' + (theme.huerotate || 0) + 'deg)');
}
root.setProperty('--darkened-backdrop-filter', 'grayscale(1) brightness(' + (theme.readablebrightness || 0) + ')');
}
function rainbowMode() {
theme.huerotate += 1;
if (theme.huerotate >= 360) {
theme.huerotate = 0
}
root.setProperty('--regular-backdrop-filter', 'hue-rotate(' + theme.huerotate + 'deg)');
}
function resetTheme() {
theme = {huerotate:0, background:'/img/lowpolyBackground.svg', readablebrightness:0.3, rainbow:0};
localStorage.setItem('theme', JSON.stringify(theme));
updateCSS();
}