Skip to content

Commit db370b1

Browse files
basicavisualbasicavisual
committed
connected newsletter to brevo
1 parent e3e7158 commit db370b1

3 files changed

Lines changed: 29 additions & 23 deletions

File tree

‎src/components/SubscribeBox.svelte‎

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,11 @@
22
export let color;
33
export let text;
44
export let subscribeForm;
5+
6+
let mailchimp_url = "https://codeandomexico.us17.list-manage.com/subscribe/post?u=6a37b9b668c1da15bcc718fa4&id=203574be23&f_id=0053bbe0f0"
7+
let breveo_url = "https://e84a0152.sibforms.com/serve/MUIFABjdnMHTbxQ2khl6ph4PImtHS0y057KeTtnZ8ST-53106GteNUOJUzjhpVFibL3A_kN8NSvM-dHnI4U0Eu2CLfsvr_sm9db1VdgsqQvtFJFiM9KySFp7o3hZxzON2vLkcj-ioBELpTPFkCBfA2M2lg0fRjsXNlo99Mynwc6T2rYL4mDx6KHLxCXgwauF_DuSGhxf_l71MVh9"
8+
// todo: Este regex testeado no deja pasar un dominio sin TLD (ej. a@a) pero implementado aquí, sí lo permite. hay que modificarlo
9+
let regex = "(?:[a-z0-9!#$%&*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&*+/=?^_`{|}~-]+)*|(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*)@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:(2(5[0-5]|[0-4][0-9])|1[0-9][0-9]|[1-9]?[0-9]))\.){3}(?:(2(5[0-5]|[0-4][0-9])|1[0-9][0-9]|[1-9]?[0-9])|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])"
510
</script>
611

712
<div class="bg-[url('/grid-bg.png')] min-h-[350px] p-2 md:p-10 h-auto w-full container m-auto flex items-center drop-shadow-full" style="background-color: {color};">
@@ -13,11 +18,15 @@
1318
</div>
1419
{#if subscribeForm }
1520
<div class="flex justify-center mx-auto my-3">
16-
<form class="w-full max-w-sm">
21+
<form class="w-full max-w-sm validate" action={breveo_url} method="post" id="newsletter-form" target="_blank" >
1722
<div class="flex items-center">
18-
<input class="appearance-none border-none w-full text-gray-700 px-4 py-3 rounded-tl-3xl rounded-bl-3xl border border-zinc-300 leading-tight focus:outline-none" type="text" placeholder="correo@ejemplo.org" aria-label="Full name">
23+
<input class="appearance-none border-none w-full text-gray-700 px-4 py-3 rounded-tl-3xl rounded-bl-3xl border-zinc-300 leading-tight focus:outline-none" placeholder="correo@ejemplo.org" aria-label="Full name" type="email" name="EMAIL" required="true" value="" pattern={regex}>
24+
<div style="position: absolute; left: -5000px;" aria-hidden="true">
25+
/* real people should not fill this in and expect good things - do not remove this or risk form bot signups */
26+
<input type="text" name="b_6a37b9b668c1da15bcc718fa4_203574be23" tabindex="-1" value="">
27+
</div>
1928
<button class="flex-shrink-0 px-5 py-2 bg-black rounded-tr-3xl h-11 rounded-br-3xl text-sm border border-black text-white rounded text-base font-bold font-['Albert Sans'] uppercase leading-normal" type="button">
20-
Suscribirme
29+
<input type="submit" name="subscribe" class="button uppercase" value="Suscribirme">
2130
</button>
2231
</div>
2332
</form>

‎src/routes/comunidad/+page.svelte‎

Lines changed: 1 addition & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
import Hero from "@/components/Hero.svelte";
33
import GetInvolvedCard from "@/components/Cards/GetInvolvedCard.svelte";
44
import CommunityCard from "@/components/Cards/CommunityCard.svelte";
5-
import CollaboratorCard from "@/components/Cards/CollaboratorCard.svelte";
5+
// import CollaboratorCard from "@/components/Cards/CollaboratorCard.svelte";
66
export let data
77
const { comunidad } = data
88
</script>
@@ -33,24 +33,5 @@
3333
<h2 class="text-4xl text-center font-bold my-8">Contribuidores y colaboradores</h2>
3434
<div class="flex flex-wrap justify-start mx-auto">
3535
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
36-
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
37-
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
38-
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
39-
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
40-
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
41-
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
42-
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
43-
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
44-
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
45-
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
46-
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
47-
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
48-
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
49-
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
50-
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
51-
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
52-
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
53-
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
54-
<CollaboratorCard image="/collaborator-example.png" url="https://google.com/" name="Juana Pérez"/>
5536
</div>
5637
</section> -->

‎src/routes/newsletter/confirmed/+page.svelte‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<div class="container mx-auto py-20">
2+
<div class="h-full flex flex-col justify-center min-h-20 py-20">
3+
4+
5+
<div style={`box-shadow: 7px 7px 1px black;`} class="w-1/2 mx-auto bg-[url('/grid-bg.png')] bg-[#c2deff]">
6+
7+
<div class="p-5 ">
8+
<h3 class="text-3xl text-center font-bold my-4">Tu suscripción al newsletter ha sido confirmada.</h3>
9+
<p class="text-center text-lg my-2">Tu correo ha sido añadido a nuestra lista y recibirás pronto nuestros newsletters.</p>
10+
<p class="text-center text-lg my-2">Gracias por suscribirte 🎈</p>
11+
</div>
12+
</div>
13+
14+
15+
</div>
16+
</div>

0 commit comments

Comments
 (0)