49401f1b41
Bootstrapped during the 2026-06-06 BlockNinja consolidation. Was previously an unversioned directory inside ~/src/blockninja-themes/earthen. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
80 lines
2.6 KiB
Plaintext
80 lines
2.6 KiB
Plaintext
package main
|
|
|
|
import "strconv"
|
|
|
|
// donationCTAComponent renders the moss/clay donation CTA section.
|
|
templ donationCTAComponent(data DonationCTAData) {
|
|
<section
|
|
data-block="earthen:donation_cta"
|
|
data-empty?={ data.Empty }
|
|
class="earthen-donation-cta py-16 px-4"
|
|
style="background-color: hsl(var(--card)); color: hsl(var(--card-foreground));"
|
|
>
|
|
<div class="max-w-3xl mx-auto text-center">
|
|
if data.Headline != "" {
|
|
<h2
|
|
class="earthen-display text-3xl md:text-4xl mb-4"
|
|
style={ "font-family: var(--font-heading, \"Fraunces\", \"Playfair Display\", Georgia, serif); color: hsl(var(--primary));" }
|
|
>
|
|
{ data.Headline }
|
|
</h2>
|
|
}
|
|
if data.Body != "" {
|
|
<div
|
|
class="earthen-body text-lg mb-8 mx-auto max-w-xl"
|
|
style={ "font-family: var(--font-body, \"Spectral\", Georgia, serif); color: hsl(var(--foreground));" }
|
|
>
|
|
@templ.Raw(data.Body)
|
|
</div>
|
|
}
|
|
<form action={ templ.SafeURL(donationFormAction(data.ProcessorURL)) } method="get" class="space-y-6">
|
|
<div class="grid grid-cols-1 sm:grid-cols-3 gap-3" role="radiogroup" aria-label="Preset donation amounts">
|
|
for i, tile := range data.Tiles {
|
|
<label
|
|
data-amount-tile
|
|
class="earthen-tile flex items-center justify-center cursor-pointer rounded-lg py-4 px-3 text-lg font-semibold transition-colors"
|
|
style="border: 1px solid hsl(var(--border)); background-color: hsl(var(--background)); color: hsl(var(--foreground));"
|
|
>
|
|
<input
|
|
type="radio"
|
|
name="amount"
|
|
value={ strconv.FormatFloat(tile.Value, 'f', -1, 64) }
|
|
class="sr-only"
|
|
checked?={ i == 0 }
|
|
/>
|
|
<span>{ tile.Label }</span>
|
|
</label>
|
|
}
|
|
</div>
|
|
<div class="flex flex-col sm:flex-row gap-3 items-stretch sm:items-center">
|
|
<label class="sr-only" for="earthen-custom-amount">Custom amount</label>
|
|
<input
|
|
id="earthen-custom-amount"
|
|
type="number"
|
|
name="customAmount"
|
|
min="1"
|
|
step="1"
|
|
placeholder="Other amount"
|
|
class="flex-1 rounded-lg py-3 px-4 text-base"
|
|
style="background-color: hsl(var(--background)); color: hsl(var(--foreground)); border: 1px solid hsl(var(--input));"
|
|
/>
|
|
<button
|
|
type="submit"
|
|
class="earthen-button inline-block rounded-lg py-3 px-6 font-semibold transition-colors"
|
|
style="background-color: hsl(var(--primary)); color: hsl(var(--primary-foreground));"
|
|
>
|
|
{ data.ButtonLabel }
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</section>
|
|
}
|
|
|
|
func donationFormAction(url string) string {
|
|
if url == "" {
|
|
return "#"
|
|
}
|
|
return url
|
|
}
|