web/layout: adaptive status bar colors for desktop

mostly used by safari
This commit is contained in:
wukko 2025-04-28 21:41:52 +06:00
parent 2fce88af2f
commit 78f23da0a5
No known key found for this signature in database
GPG Key ID: 3E30B3F26C7B4AA2
2 changed files with 17 additions and 3 deletions

View File

@ -42,6 +42,12 @@ export default derived(
) as Readable<Exclude<Theme, "auto">>
export const statusBarColors = {
"dark": "#000000",
"light": "#ffffff"
mobile: {
dark: "#000000",
light: "#ffffff"
},
desktop: {
dark: "#131313",
light: "#f4f4f4"
}
}

View File

@ -67,7 +67,15 @@
{/if}
{#if device.is.mobile}
<meta name="theme-color" content={statusBarColors[$currentTheme]} />
<meta
name="theme-color"
content={statusBarColors.mobile[$currentTheme]}
/>
{:else}
<meta
name="theme-color"
content={statusBarColors.desktop[$currentTheme]}
/>
{/if}
{#if plausibleLoaded || (browser && env.PLAUSIBLE_ENABLED && !$settings.privacy.disableAnalytics)}