diff --git a/web/hooks/use-font-preference.ts b/web/hooks/use-font-preference.ts index 4d1d8855..f2089f44 100644 --- a/web/hooks/use-font-preference.ts +++ b/web/hooks/use-font-preference.ts @@ -34,5 +34,6 @@ export const applyFontPreference = (font: FontOption) => { const getStoredFontPreference = (): FontOption => { if (typeof window === 'undefined') return 'atkinson' - return JSON.parse(localStorage.getItem('font-preference') ?? 'null') ?? 'atkinson' + const theme = JSON.parse(localStorage.getItem('font-preference') ?? 'null') ?? 'atkinson' + return theme.value ?? (theme as FontOption) } diff --git a/web/hooks/use-measurement-system.ts b/web/hooks/use-measurement-system.ts index e9c87519..b1fbf29c 100644 --- a/web/hooks/use-measurement-system.ts +++ b/web/hooks/use-measurement-system.ts @@ -9,7 +9,8 @@ export const useMeasurementSystem = () => { try { const saved = localStorage.getItem('measurement-system') if (saved) { - const parsed = JSON.parse(saved) + let parsed = JSON.parse(saved) + parsed = parsed.value ?? parsed if (parsed === 'metric' || parsed === 'imperial') { return parsed } diff --git a/web/hooks/use-theme.ts b/web/hooks/use-theme.ts index 482b2b2b..19203a5a 100644 --- a/web/hooks/use-theme.ts +++ b/web/hooks/use-theme.ts @@ -49,7 +49,8 @@ const reRenderTheme = () => { } function getTheme() { - return JSON.parse(localStorage.getItem('theme') ?? 'null') ?? 'auto' + const theme = JSON.parse(localStorage.getItem('theme') ?? 'null') ?? 'auto' + return theme.value ?? theme } function isDark(theme: theme_option | null) { diff --git a/web/public/init-theme.js b/web/public/init-theme.js index 8ddd3def..0f545154 100644 --- a/web/public/init-theme.js +++ b/web/public/init-theme.js @@ -1,7 +1,8 @@ // run this in as blocking to prevent flash of unstyled content. See theme-provider.tsx { const localTheme = localStorage.getItem('theme') - const theme = localTheme ? JSON.parse(localTheme) : 'auto' + let theme = localTheme ? JSON.parse(localTheme) : 'auto' + theme = theme.value ?? theme if ( theme === 'dark' || @@ -11,7 +12,8 @@ } const localFontPreference = localStorage.getItem('font-preference') - const fontPreference = localFontPreference ? JSON.parse(localFontPreference) : 'atkinson' + let fontPreference = localFontPreference ? JSON.parse(localFontPreference) : 'atkinson' + fontPreference = fontPreference.value ?? fontPreference const fontFamilies = { atkinson: '"Atkinson Hyperlegible Next", Georgia, "Times New Roman", Times, serif',