fix: apply org branding via inline style attribute instead of style tag

Inline style on the wrapper div overrides @theme CSS variables via
CSS cascade (element styles beat stylesheet :root). This reliably
applies per-tenant branding regardless of stylesheet load order.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-03-26 17:27:37 -05:00
co-authored by Claude Opus 4.6
parent 473d3dd28c
commit dbb7a0348b
2 changed files with 2 additions and 12 deletions
-10
View File
@@ -1,16 +1,6 @@
@import 'tailwindcss';
@theme {
--color-primary: initial;
--color-primary-light: initial;
--color-primary-dark: initial;
--color-accent: initial;
--color-accent-light: initial;
--color-accent-dark: initial;
--color-warm-bg: initial;
}
:root {
--color-primary: #0d9488;
--color-primary-light: #14b8a6;
--color-primary-dark: #0f766e;
+2 -2
View File
@@ -9,10 +9,10 @@
<meta name="description" content="{data.orgConfig.orgInfo.name} — {data.orgConfig.orgInfo.tagline || 'A foster-based animal rescue'}" />
<meta property="og:site_name" content={data.orgConfig.orgInfo.name} />
<meta property="og:type" content="website" />
{@html `<style>:root:root{--color-primary:${data.orgConfig.branding.primaryColor};--color-primary-light:${data.orgConfig.branding.primaryColorLight};--color-primary-dark:${data.orgConfig.branding.primaryColorDark};--color-accent:${data.orgConfig.branding.accentColor};--color-accent-light:${data.orgConfig.branding.accentColorLight};--color-accent-dark:${data.orgConfig.branding.accentColorDark}}</style>`}
</svelte:head>
<div class="min-h-screen flex flex-col bg-warm-bg">
<div class="min-h-screen flex flex-col bg-warm-bg" style="--color-primary:{data.orgConfig.branding.primaryColor};--color-primary-light:{data.orgConfig.branding.primaryColorLight};--color-primary-dark:{data.orgConfig.branding.primaryColorDark};--color-accent:{data.orgConfig.branding.accentColor};--color-accent-light:{data.orgConfig.branding.accentColorLight};--color-accent-dark:{data.orgConfig.branding.accentColorDark}">
<Header
orgName={data.orgConfig.orgInfo.name}
logoUrl={data.orgConfig.branding.logoUrl}