alice.pds.demo.boltless.dev
This repository has no description
1{{ define "timeline/fragments/newsletterWidget" }}
2<div
3 id="newsletter-widget"
4 class="relative border border-green-800/15 dark:border-green-700 rounded bg-green-50 dark:bg-green-950 p-4 flex-1">
5 <button
6 type="button"
7 onclick="
8 document.getElementById('newsletter-widget').remove();
9 localStorage.setItem('newsletter-dismissed', '1');
10 "
11 class="absolute top-4 right-4 text-gray-500 hover:text-gray-700 dark:hover:text-gray-200 leading-none text-sm"
12 aria-label="Dismiss">
13 ✕
14 </button>
15 <p class="text-green-900 dark:text-green-300 pr-6 mb-3">
16 We've got a newsletter!
17 <br />
18 Punch in your email to subscribe.
19 </p>
20 <form
21 hx-post="/newsletter/signup"
22 hx-target="#newsletter-widget-msg"
23 hx-swap="outerHTML">
24 <span id="newsletter-widget-msg" class="flex items-center gap-2">
25 <input
26 type="email"
27 name="email"
28 placeholder="your@email.com"
29 required
30 class="flex-1 min-w-0 text-sm" />
31 <button type="submit" class="btn whitespace-nowrap h-12 px-4 pb-0 gap-2">
32 {{ i "mail-plus" "size-4 inline" }}
33 subscribe
34 </button>
35 </span>
36 </form>
37</div>
38<script>
39 if (localStorage.getItem("newsletter-dismissed"))
40 document.getElementById("newsletter-widget").remove();
41</script>
42{{ end }}