diff --git a/docs/THEMING.md b/docs/THEMING.md index 5c1aa93..3ad501d 100644 --- a/docs/THEMING.md +++ b/docs/THEMING.md @@ -151,6 +151,11 @@ Font sizes use `clamp()` for fluid scaling (see the `h1`-`h4` rules in generated from the brand source (`newicons.py`); add icons there. - **Motifs:** `` shows a brand motif from `public/motifs/`, copied from the brand files with ring text outlined to paths. `-light` files - are the Starlight recolor. One focal motif per surface, kept faint. + are the Starlight recolor. One focal motif per surface, kept faint. Every + page carries at least one seal: night-sky heroes have the turning layered + seal, and pages without a hero use `` behind the header. +- **Shape:** cards and panels have 10px corners (`--radius-xl`/`2xl`/`3xl` are + pinned to 10px); buttons and tags are pills. The Patiun seal is never shown + below 72px (nav and footer use 72px). - **Gold accents:** image frames, quote bars, dividers and rules use `--color-gold`; teal stays for links, buttons and icons. diff --git a/public/motifs/craft-seal-print-light.svg b/public/motifs/craft-seal-print-light.svg new file mode 100644 index 0000000..e3544a2 --- /dev/null +++ b/public/motifs/craft-seal-print-light.svg @@ -0,0 +1,2 @@ + + \ No newline at end of file diff --git a/public/motifs/kepler-nest-seal-light.svg b/public/motifs/kepler-nest-seal-light.svg new file mode 100644 index 0000000..306452d --- /dev/null +++ b/public/motifs/kepler-nest-seal-light.svg @@ -0,0 +1,2 @@ + + \ No newline at end of file diff --git a/public/motifs/squared-circle-seal-light.svg b/public/motifs/squared-circle-seal-light.svg new file mode 100644 index 0000000..7846af2 --- /dev/null +++ b/public/motifs/squared-circle-seal-light.svg @@ -0,0 +1,2 @@ + + \ No newline at end of file diff --git a/public/motifs/zodiac-seal-light.svg b/public/motifs/zodiac-seal-light.svg new file mode 100644 index 0000000..875dc31 --- /dev/null +++ b/public/motifs/zodiac-seal-light.svg @@ -0,0 +1,2 @@ + + \ No newline at end of file diff --git a/src/components/brand/Motif.astro b/src/components/brand/Motif.astro index dda292e..350dd97 100644 --- a/src/components/brand/Motif.astro +++ b/src/components/brand/Motif.astro @@ -15,12 +15,16 @@ * Usage: * */ -interface Props { +export interface Props { name: | "layered-seal" | "astrolabe" | "transmutation-seal-light" - | "tria-prima-array-seal-light"; + | "tria-prima-array-seal-light" + | "zodiac-seal-light" + | "craft-seal-print-light" + | "squared-circle-seal-light" + | "kepler-nest-seal-light"; class?: string; style?: string; } diff --git a/src/components/brand/PageSeal.astro b/src/components/brand/PageSeal.astro new file mode 100644 index 0000000..ac968b2 --- /dev/null +++ b/src/components/brand/PageSeal.astro @@ -0,0 +1,29 @@ +--- +/** + * PageSeal.astro + * --------------------------------------------------------------------------- + * A faint Patiun seal behind the top-right of a page header, for pages + * without a night-sky hero (those already carry the turning layered seal). + * Sits behind content (-z-10) and is clipped so it never widens the page. + * + * Usage (first thing inside the page): + */ +import Motif from "@components/brand/Motif.astro"; +import type { Props as MotifProps } from "@components/brand/Motif.astro"; + +interface Props { + name: MotifProps["name"]; +} +const { name } = Astro.props; +--- + + diff --git a/src/components/hero/AnimatedBackground.tsx b/src/components/hero/AnimatedBackground.tsx index 7d1f4f1..7d3460e 100644 --- a/src/components/hero/AnimatedBackground.tsx +++ b/src/components/hero/AnimatedBackground.tsx @@ -87,9 +87,8 @@ export default function AnimatedBackground({ const gold = getComputedStyle(document.documentElement).getPropertyValue('--color-gold').trim() || '#c9a24a'; - // Nebula Violet is background light only, so violet stars use a lifted - // tint of it; teal stars use the on-dark teal so they read at dot size. - const violet = '#8a63ee'; + // Nebula Violet is background light only, so violet stars stay sparse; teal stars use the on-dark teal so they read at dot size. + const violet = '#6a2fe0'; const teal = getComputedStyle(document.documentElement).getPropertyValue('--color-teal-bright').trim() || '#2bc2b7'; diff --git a/src/components/layout/Footer.astro b/src/components/layout/Footer.astro index 51816d2..2915456 100644 --- a/src/components/layout/Footer.astro +++ b/src/components/layout/Footer.astro @@ -26,7 +26,7 @@ const socialList = Object.values(socials); />
- +

{siteIdentity.name} diff --git a/src/components/mystic/CircuitField.tsx b/src/components/mystic/CircuitField.tsx index d14ab73..272a390 100644 --- a/src/components/mystic/CircuitField.tsx +++ b/src/components/mystic/CircuitField.tsx @@ -57,7 +57,7 @@ export default function CircuitField({ let nodes: Node[] = []; const gold = '#c9a24a'; - const violet = '#8a63ee'; + const violet = '#6a2fe0'; const teal = '#2bc2b7'; function build() { diff --git a/src/components/mystic/ConstellationField.tsx b/src/components/mystic/ConstellationField.tsx index 7d32189..6414883 100644 --- a/src/components/mystic/ConstellationField.tsx +++ b/src/components/mystic/ConstellationField.tsx @@ -68,7 +68,7 @@ export default function ConstellationField({ let stars: Star[] = []; const gold = '#c9a24a'; - const violet = '#8a63ee'; + const violet = '#6a2fe0'; const teal = '#2bc2b7'; const white = '#f4f2ed'; const accent = tint === 'violet' ? violet : tint === 'teal' ? teal : gold; diff --git a/src/components/nav/NavBar.astro b/src/components/nav/NavBar.astro index 7d0b4d3..53aa31c 100644 --- a/src/components/nav/NavBar.astro +++ b/src/components/nav/NavBar.astro @@ -41,7 +41,7 @@ const heroSkyClass = isHome ? "" : "vt-hero-sky"; data-nav-inner >