mirror of
https://github.com/Patiun/com.gregkilmer.www.git
synced 2026-11-07 19:58:24 +00:00
Claude
35c09f2854
- Store domain shown as Store.GregKilmer.com (no uppercase transform) - Cards and panels 10px corners; buttons pill-shaped - Canvas star/circuit violet switched to brand violet #6A2FE0 - Nav, store nav and footer seal at the brand's 72px minimum (nav 80px tall) - Faint seals on contact, store cards, deck boxes, order and professional Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_012aSbo2D1qP8cMFQCykf7kx
62 lines
2.5 KiB
Plaintext
62 lines
2.5 KiB
Plaintext
---
|
|
/**
|
|
* Footer.astro
|
|
* ---------------------------------------------------------------------------
|
|
* Minimal footer on a deep night-sky surface: a faint static starfield accent,
|
|
* the Patiun seal beside the name, social links, the copyright with the
|
|
* "a Patiun LLC company" line, and
|
|
* the spec microcopy "Built with intention. Powered by caffeine." No emojis.
|
|
*/
|
|
import Icon from '@components/Icon.astro';
|
|
import StarField from '@components/mystic/StarField.astro';
|
|
import { socials, footerMicrocopy, siteIdentity } from '@lib/site';
|
|
const year = new Date().getFullYear();
|
|
const socialList = Object.values(socials);
|
|
---
|
|
|
|
<footer
|
|
class="relative overflow-hidden border-t"
|
|
style="border-color: color-mix(in srgb, var(--color-gold) 55%, transparent); background: var(--color-surface-sunken);"
|
|
>
|
|
{/* Faint static starfield — carries the night-sky treatment into the footer. */}
|
|
<StarField
|
|
class="pointer-events-none absolute inset-0 h-full w-full"
|
|
style="color: var(--color-accent); opacity:.35;"
|
|
density="sparse"
|
|
/>
|
|
<div class="container-prose relative z-10 flex flex-col items-center gap-6 py-10 text-center sm:flex-row sm:justify-between sm:text-left">
|
|
<div class="flex items-center gap-3">
|
|
<img src="/brand/patiun-seal.svg" alt="" width="72" height="72" class="h-[72px] w-[72px] shrink-0" />
|
|
<div class="flex flex-col gap-1">
|
|
<p class="font-display text-sm font-bold uppercase tracking-[0.14em]" style="color: var(--color-text);">
|
|
{siteIdentity.name}
|
|
</p>
|
|
<p class="font-eyebrow text-xs italic" style="color: var(--color-text-subtle);">
|
|
{footerMicrocopy}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<ul class="flex items-center gap-2">
|
|
{socialList.map((s) => (
|
|
<li>
|
|
<a
|
|
href={s.href}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
aria-label={s.label}
|
|
title={s.label}
|
|
class="inline-flex h-10 w-10 items-center justify-center rounded-lg border transition-colors hover:bg-[color-mix(in_srgb,var(--color-accent)_15%,transparent)]"
|
|
style="color: var(--color-text-muted); border-color: var(--color-border);"
|
|
>
|
|
<Icon name={s.icon} class="h-5 w-5" />
|
|
</a>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
<div class="container-prose relative z-10 pb-8 text-center text-xs" style="color: var(--color-text-subtle);">
|
|
© {year} {siteIdentity.name} · {siteIdentity.lockupLine}. All rights reserved.
|
|
</div>
|
|
</footer>
|