Troplo/pleroma-fe
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

refactor toggling body visibility using class

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/App.scss
View file

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

8
src/services/style_setter/style_setter.js
View file

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