fix: use :root:root for org branding to beat stylesheet specificity
The @theme `:root` block in the compiled CSS was overriding the inline style tag because the stylesheet loads after svelte:head content. Double :root selector gives the inline override higher specificity. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
+11
-1
@@ -1,6 +1,16 @@
|
||||
@import 'tailwindcss';
|
||||
|
||||
@theme inline {
|
||||
@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;
|
||||
|
||||
@@ -9,7 +9,7 @@
|
||||
<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{--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>`}
|
||||
{@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">
|
||||
|
||||
Reference in New Issue
Block a user