padreug/chateaudufaune.ariege.io
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat(theme): dark forest palette + Aboreto/Italianno/Roboto fonts

Browse source 
Retheme to match the Wix source: deep forest-green background
(hsl 151 100% 8%), cream foreground, gold primary/accent. Update
both :root and .dark variants for dark-by-default.

Load Aboreto (display), Italianno (calligraphic script for the hero
title) and Roboto 300/400/500/700 from Google Fonts with preconnect
hints. Define --font-sans / --font-display / --font-script tokens,
which Tailwind 4 exposes as font-sans / font-display / font-script
utilities.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Padreug 2026-06-08 21:22:10 +02:00
commit 149b8e0a7c
2 changed files with 52 additions and 45 deletions
Download patch file Download diff file Expand all files Collapse all files

91
src/style.css
View file

@ -4,50 +4,50 @@
@custom-variant dark (&:is(.dark *));
:root {
/* Earthy palette: warm parchment background, deep moss primary,
terracotta accent. Tuned for an artist-residency / land-art vibe. */
--background: hsl(38 32% 96%);
--foreground: hsl(120 14% 12%);
--card: hsl(38 30% 98%);
--card-foreground: hsl(120 14% 12%);
--popover: hsl(38 30% 98%);
--popover-foreground: hsl(120 14% 12%);
--primary: hsl(125 24% 24%);
--primary-foreground: hsl(38 32% 96%);
--secondary: hsl(36 22% 88%);
--secondary-foreground: hsl(120 14% 12%);
--muted: hsl(36 18% 92%);
--muted-foreground: hsl(120 8% 38%);
--accent: hsl(22 58% 48%);
--accent-foreground: hsl(38 32% 96%);
--destructive: hsl(0 70% 45%);
--destructive-foreground: hsl(38 32% 96%);
--border: hsl(36 16% 82%);
--input: hsl(36 16% 82%);
--ring: hsl(125 24% 30%);
/* Wix-inspired palette: deep forest green dominant background, cream
foreground, gold (Aboreto/calligraphic spirit) for CTAs and accents. */
--background: hsl(151 100% 8%);
--foreground: hsl(200 32% 94%);
--card: hsl(151 80% 10%);
--card-foreground: hsl(200 32% 94%);
--popover: hsl(151 80% 10%);
--popover-foreground: hsl(200 32% 94%);
--primary: hsl(43 64% 41%);
--primary-foreground: hsl(151 100% 6%);
--secondary: hsl(151 65% 12%);
--secondary-foreground: hsl(200 32% 94%);
--muted: hsl(151 50% 14%);
--muted-foreground: hsl(200 15% 72%);
--accent: hsl(50 65% 50%);
--accent-foreground: hsl(151 100% 6%);
--destructive: hsl(0 60% 50%);
--destructive-foreground: hsl(200 32% 94%);
--border: hsl(151 50% 18%);
--input: hsl(151 50% 18%);
--ring: hsl(43 64% 50%);
--radius: 0.5rem;
}
.dark {
--background: hsl(120 12% 8%);
--foreground: hsl(38 26% 94%);
--card: hsl(120 10% 11%);
--card-foreground: hsl(38 26% 94%);
--popover: hsl(120 10% 11%);
--popover-foreground: hsl(38 26% 94%);
--primary: hsl(38 28% 88%);
--primary-foreground: hsl(120 14% 12%);
--secondary: hsl(120 8% 18%);
--secondary-foreground: hsl(38 26% 94%);
--muted: hsl(120 8% 18%);
--muted-foreground: hsl(36 14% 66%);
--accent: hsl(22 52% 55%);
--accent-foreground: hsl(120 14% 12%);
--destructive: hsl(0 60% 40%);
--destructive-foreground: hsl(38 26% 94%);
--border: hsl(120 8% 22%);
--input: hsl(120 8% 22%);
--ring: hsl(38 26% 72%);
--background: hsl(151 100% 6%);
--foreground: hsl(200 32% 94%);
--card: hsl(151 80% 8%);
--card-foreground: hsl(200 32% 94%);
--popover: hsl(151 80% 8%);
--popover-foreground: hsl(200 32% 94%);
--primary: hsl(43 64% 45%);
--primary-foreground: hsl(151 100% 6%);
--secondary: hsl(151 65% 10%);
--secondary-foreground: hsl(200 32% 94%);
--muted: hsl(151 50% 12%);
--muted-foreground: hsl(200 15% 70%);
--accent: hsl(50 65% 52%);
--accent-foreground: hsl(151 100% 6%);
--destructive: hsl(0 60% 45%);
--destructive-foreground: hsl(200 32% 94%);
--border: hsl(151 50% 15%);
--input: hsl(151 50% 15%);
--ring: hsl(43 64% 52%);
}
@theme inline {
@ -74,9 +74,9 @@
--radius-md: calc(var(--radius) - 2px);
--radius-sm: calc(var(--radius) - 4px);
--font-sans:
ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,
sans-serif;
--font-serif: 'Cormorant Garamond', Cambria, Georgia, 'Times New Roman', serif;
'Roboto', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
--font-display: 'Aboreto', 'Cormorant Garamond', Georgia, serif;
--font-script: 'Italianno', 'Allura', 'Pinyon Script', cursive;
}
@layer base {
@ -86,11 +86,12 @@
body {
@apply bg-background text-foreground;
font-family: var(--font-sans);
font-weight: 300;
}
h1,
h2,
h3 {
font-family: var(--font-serif);
letter-spacing: -0.01em;
font-family: var(--font-display);
letter-spacing: 0.02em;
}
}