From 61a8c4475036441e2e8ff10c70c427708284e464 Mon Sep 17 00:00:00 2001 From: Jon Staab Date: Wed, 1 Jul 2026 16:32:25 -0700 Subject: [PATCH] Prevent initial font size flash --- src/routes/+layout.svelte | 18 +++++++++++++----- 1 file changed, 13 insertions(+), 5 deletions(-) diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 0117a898..a971b0d6 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -35,7 +35,7 @@ import {authPolicy, blockPolicy, trustPolicy, mostlyRestrictedPolicy} from "@app/policies" import {db, kv, ss} from "@app/storage" import {device} from "@app/device" - import {getSetting, userSettingsValues, notificationSettings} from "@app/settings" + import {getSetting, userSettings, notificationSettings} from "@app/settings" import {DUFFLEPUD_URL, INDEXER_RELAYS, POMADE_SIGNERS} from "@app/env" import {pushState} from "@app/push/adapters/common" import {syncApplicationData} from "@app/sync" @@ -80,6 +80,10 @@ maybeInstallRelayMocks() } + // Do this asap to avoid a font size flash + // @ts-ignore + document.documentElement.style["font-size"] = `${localStorage.getItem("font-size") || 1.1}rem` + const policies = [authPolicy, blockPolicy, trustPolicy, mostlyRestrictedPolicy] // Add stuff to window for convenience @@ -275,10 +279,14 @@ document.body.setAttribute("data-theme", $theme) document.body.setAttribute("data-fl-theme", env.FL_THEME) }), - userSettingsValues.subscribe( - debounce(100, $userSettingsValues => { - // @ts-ignore - document.documentElement.style["font-size"] = `${$userSettingsValues.font_size}rem` + userSettings.subscribe( + debounce(100, $userSettings => { + if ($userSettings) { + localStorage.setItem("font-size", $userSettings.values.font_size) + + // @ts-ignore + document.documentElement.style["font-size"] = `${$userSettings.values.font_size}rem` + } }), ), )