kglt/fyne-on
1
0
Fork 0
Code Pull requests Activity Actions

feat: theme colors (#1195)

Browse source
This commit is contained in:
Anthony Fu 2023-01-16 11:26:19 +01:00 • committed by GitHub
parent 2e79f3aa37
commit 8753a94aae
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
19 changed files with 298 additions and 35 deletions
Download patch file Download diff file Expand all files Collapse all files

5
plugins/setup-global-effects.client.ts
View file

@ -3,11 +3,14 @@ import { DEFAULT_FONT_SIZE } from '~/constants'
export default defineNuxtPlugin(() => {
const userSettings = useUserSettings()
const html = document.querySelector('html')!
const html = document.documentElement
watchEffect(() => {
html.style.setProperty('--font-size', fontSizeMap[userSettings.value.fontSize || DEFAULT_FONT_SIZE])
})
watchEffect(() => {
html.classList.toggle('zen', userSettings.value.zenMode)
})
watchEffect(() => {
Object.entries(userSettings.value.themeColors || {}).forEach(([k, v]) => html.style.setProperty(k, v))
})
})

5
plugins/setup-head-script.server.ts
View file

@ -15,7 +15,7 @@ export default defineNuxtPlugin(() => {
const settings = allSettings[handle]
if (!settings) { return }
const html = document.querySelector('html')
const html = document.documentElement
${process.dev ? 'console.log({ settings })' : ''}
if (settings.fontSize) {
@ -28,6 +28,9 @@ export default defineNuxtPlugin(() => {
if (settings.zenMode) {
html.classList.add('zen')
}
if (settings.themeColors) {
Object.entries(settings.themeColors).map(i => html.style.setProperty(i[0], i[1]))
}
})()`.trim().replace(/\s*\n+\s*/g, ';'),
},
],