fix apply theme button without page refresh

This commit is contained in:
Denys Nykula 2023-05-01 20:54:18 +03:00 committed by eris
parent ceb8fc7f16
commit 02a53d5662
2 changed files with 15 additions and 7 deletions

View file

@ -89,6 +89,10 @@
margin: 1em 1em 0;
}
.presets {
text-align: center;
}
.tab-header {
display: flex;
justify-content: space-between;

View file

@ -7,14 +7,18 @@ export const applyTheme = (input) => {
const body = document.body
body.classList.add('hidden')
const styleEl = document.getElementById('theme-holder')
const styleSheet = styleEl.sheet
/** @type {CSSStyleSheet} */
const styleSheet = document.getElementById('theme-holder').sheet
for (let i = styleSheet.cssRules.length; i--; ) {
styleSheet.deleteRule(0)
}
styleSheet.insertRule(
`:root { ${rules.radii}; ${rules.colors}; ${rules.shadows}; ${rules.fonts}; }`,
0
)
styleSheet.toString()
styleSheet.insertRule(`:root { ${rules.radii} }`, 'index-max')
styleSheet.insertRule(`:root { ${rules.colors} }`, 'index-max')
styleSheet.insertRule(`:root { ${rules.shadows} }`, 'index-max')
styleSheet.insertRule(`:root { ${rules.fonts} }`, 'index-max')
body.classList.remove('hidden')
}