feat(settings): respect settings from server (#1013)
This commit is contained in:
parent
32aa47e701
commit
9a41b9b7d7
27 changed files with 230 additions and 167 deletions
|
@ -1,24 +1,26 @@
|
|||
import type { FontSize } from '~/types'
|
||||
import { InjectionKeyFontSize } from '~/constants/symbols'
|
||||
import type { FontSize } from '~/composables/settings'
|
||||
import { COOKIE_KEY_FONT_SIZE, COOKIE_MAX_AGE, DEFAULT_FONT_SIZE } from '~/constants'
|
||||
import { fontSizeMap } from '~/constants/options'
|
||||
|
||||
export default defineNuxtPlugin((nuxt) => {
|
||||
export default defineNuxtPlugin(() => {
|
||||
const userSettings = useUserSettings()
|
||||
const cookieFontSize = useCookie<FontSize>(COOKIE_KEY_FONT_SIZE, { default: () => DEFAULT_FONT_SIZE, maxAge: COOKIE_MAX_AGE })
|
||||
nuxt.vueApp.provide(InjectionKeyFontSize, cookieFontSize)
|
||||
if (!cookieFontSize.value || !fontSizeMap[cookieFontSize.value])
|
||||
cookieFontSize.value = DEFAULT_FONT_SIZE
|
||||
|
||||
if (!process.server) {
|
||||
watchEffect(() => {
|
||||
document.documentElement.style.setProperty('--font-size', fontSizeMap[cookieFontSize.value || DEFAULT_FONT_SIZE])
|
||||
})
|
||||
}
|
||||
else {
|
||||
if (process.server) {
|
||||
userSettings.value.fontSize = cookieFontSize.value
|
||||
useHead({
|
||||
style: [
|
||||
{
|
||||
innerHTML: `:root { --font-size: ${fontSizeMap[cookieFontSize.value || DEFAULT_FONT_SIZE]}; }`,
|
||||
},
|
||||
{ innerHTML: `:root { --font-size: ${fontSizeMap[cookieFontSize.value]}; }` },
|
||||
],
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
userSettings.value.fontSize = cookieFontSize.value
|
||||
watch(() => userSettings.value.fontSize, (size) => {
|
||||
document.documentElement.style.setProperty('--font-size', fontSizeMap[size])
|
||||
cookieFontSize.value = size
|
||||
}, { immediate: true })
|
||||
})
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue