refactor toggling body visibility using class

This commit is contained in:
taehoon 2019-08-27 12:17:10 -04:00
parent e75ac9ddbc
commit ea5b36a597
2 changed files with 8 additions and 4 deletions

View File

@ -49,6 +49,10 @@ body {
overflow-x: hidden;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
&.hidden {
display: none;
}
}
a {

View File

@ -22,7 +22,7 @@ const setStyle = (href, commit) => {
***/
const head = document.head
const body = document.body
body.style.display = 'none'
body.classList.add('hidden')
const cssEl = document.createElement('link')
cssEl.setAttribute('rel', 'stylesheet')
cssEl.setAttribute('href', href)
@ -46,7 +46,7 @@ const setStyle = (href, commit) => {
head.appendChild(styleEl)
// const styleSheet = styleEl.sheet
body.style.display = 'initial'
body.classList.remove('hidden')
}
cssEl.addEventListener('load', setDynamic)
@ -75,7 +75,7 @@ const applyTheme = (input, commit) => {
const { rules, theme } = generatePreset(input)
const head = document.head
const body = document.body
body.style.display = 'none'
body.classList.add('hidden')
const styleEl = document.createElement('style')
head.appendChild(styleEl)
@ -86,7 +86,7 @@ const applyTheme = (input, commit) => {
styleSheet.insertRule(`body { ${rules.colors} }`, 'index-max')
styleSheet.insertRule(`body { ${rules.shadows} }`, 'index-max')
styleSheet.insertRule(`body { ${rules.fonts} }`, 'index-max')
body.style.display = 'initial'
body.classList.remove('hidden')
// commit('setOption', { name: 'colors', value: htmlColors })
// commit('setOption', { name: 'radii', value: radii })