Bootstrapped during the 2026-06-06 BlockNinja consolidation. Was previously an unversioned directory inside ~/src/blockninja-themes/pastel-dream. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
43 lines
1.9 KiB
Plaintext
43 lines
1.9 KiB
Plaintext
package main
|
|
|
|
// cozyFooterComponent renders the cozy footer with newsletter signup,
|
|
// a closing affirmation, an optional menu column, and social pill links.
|
|
templ cozyFooterComponent(data CozyFooterData) {
|
|
<section class="relative py-16 md:py-20 overflow-hidden bg-watercolor-mint" data-block="pastel-dream:cozy-footer">
|
|
// Decorative watercolor blob, top right
|
|
<svg class="absolute -top-8 -right-8 w-64 h-64 -z-0" viewBox="0 0 300 300" aria-hidden="true">
|
|
<path d="M150,30 C220,30 270,90 270,150 C270,220 200,270 140,270 C80,270 30,210 30,150 C30,90 80,30 150,30 Z" fill="hsl(var(--primary) / 0.16)"></path>
|
|
</svg>
|
|
<div class="relative z-10 max-w-4xl mx-auto px-4 text-center">
|
|
<p class="font-display text-3xl mb-6" style="color: hsl(var(--foreground));">
|
|
{ data.Affirmation }
|
|
</p>
|
|
if data.ShowSignup {
|
|
<form class="flex flex-col sm:flex-row gap-3 max-w-md mx-auto mb-8" data-pastel-signup="true" onsubmit="event.preventDefault();">
|
|
<label class="sr-only" for="pastel-newsletter-email">Email</label>
|
|
<input
|
|
id="pastel-newsletter-email"
|
|
type="email"
|
|
placeholder="you@calm.day"
|
|
class="flex-1 px-5 py-3 font-body rounded-full"
|
|
style="background-color: hsl(var(--input)); color: hsl(var(--foreground)); border: 1px solid hsl(var(--border));"
|
|
/>
|
|
<button type="submit" class="pastel-pill">Stay in touch</button>
|
|
</form>
|
|
}
|
|
if len(data.Social) > 0 {
|
|
<div class="flex justify-center gap-3 flex-wrap mt-6">
|
|
for _, href := range data.Social {
|
|
<a href={ templ.SafeURL(href) } class="px-4 py-2 font-body text-xs uppercase tracking-[0.2em] rounded-full" style="background-color: hsl(var(--card)); color: hsl(var(--card-foreground)); border: 1px solid hsl(var(--border));">
|
|
Visit
|
|
</a>
|
|
}
|
|
</div>
|
|
}
|
|
<p class="font-mono text-xs mt-10" style="color: hsl(var(--muted-foreground));">
|
|
Pastel Dream · with care
|
|
</p>
|
|
</div>
|
|
</section>
|
|
}
|