Skip to content

Commit f3ae585

Browse files
MariferVLMariferVL
committed
Improve sponsor view and components
1 parent f48e425 commit f3ae585

6 files changed

Lines changed: 387 additions & 435 deletions

File tree

‎src/app/sponsors/components/DynamicContent.js‎

Lines changed: 136 additions & 151 deletions
Original file line numberDiff line numberDiff line change
@@ -6,91 +6,77 @@ import SponsorForm from "@/components/SponsorForm";
66
import CTAFinal from "@/components/CTAFinal";
77
import FAQSection from "@/components/FAQSection";
88
import { sponsorshipFAQs } from "@/data/faqs";
9-
9+
import { sponsorshipData } from "@/data/sponsorshipData";
1010

1111
export default function DynamicContent() {
12+
const { intro, audience, eventStats2024, benefits, plans, contact } =
13+
sponsorshipData;
14+
1215
return (
1316
<>
17+
{/* Introducción */}
18+
<motion.section className="container mx-auto py-12 md:py-16 px-4 sm:px-6 relative">
19+
<div className="max-w-4xl mx-auto text-center">
20+
<div className="inline-block mb-4 md:mb-6">
21+
<div className="text-4xl md:text-5xl font-bold text-[#4ADE80]">
22+
“
23+
</div>
24+
</div>
25+
<p className="text-lg md:text-2xl leading-relaxed text-gray-300 font-medium px-2 sm:px-0">
26+
{intro}
27+
<span className="block mt-4 md:mt-6 text-[#FFD43B] font-semibold text-base md:text-lg">
28+
¡Sé parte de la revolución Python 2025!
29+
</span>
30+
</p>
31+
<div className="mt-6 md:mt-8 flex justify-center space-x-3 md:space-x-4">
32+
<div className="w-8 h-1 md:w-12 bg-[#4ADE80] rounded-full" />
33+
<div className="w-6 h-1 md:w-8 bg-[#FFD43B] rounded-full" />
34+
<div className="w-4 h-1 bg-[#F87171] rounded-full" />
35+
</div>
36+
</div>
37+
</motion.section>
38+
1439
{/* Beneficios de patrocinio */}
1540
<motion.section
1641
initial={{ opacity: 0 }}
1742
whileInView={{ opacity: 1 }}
1843
viewport={{ once: true }}
19-
className="container-py"
44+
className="container mx-auto py-16 px-4"
2045
>
21-
<h2 className="section-title">¿Por qué patrocinar PyDay Chile?</h2>
22-
<div className="grid grid-cols-1 md:grid-cols-3 gap-6 mt-12">
23-
<div className="bg-black/20 backdrop-blur p-6 rounded-lg text-center">
24-
<div className="bg-green-600 rounded-full h-14 w-14 flex items-center justify-center mx-auto mb-4">
25-
<svg
26-
xmlns="http://www.w3.org/2000/svg"
27-
className="h-8 w-8 text-white"
28-
fill="none"
29-
viewBox="0 0 24 24"
30-
stroke="currentColor"
31-
>
32-
<path
33-
strokeLinecap="round"
34-
strokeLinejoin="round"
35-
strokeWidth={2}
36-
d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"
37-
/>
38-
</svg>
39-
</div>
40-
<h4 className="text-xl font-bold mb-2">Visibilidad</h4>
41-
<p>
42-
Conecta tu marca con la comunidad Python de Chile y Latinoamérica.
43-
Más de 300 asistentes entre desarrolladores, profesionales y
44-
estudiantes.
45-
</p>
46-
</div>
47-
<div className="bg-black/20 backdrop-blur p-6 rounded-lg text-center">
48-
<div className="bg-green-600 rounded-full h-14 w-14 flex items-center justify-center mx-auto mb-4">
49-
<svg
50-
xmlns="http://www.w3.org/2000/svg"
51-
className="h-8 w-8 text-white"
52-
fill="none"
53-
viewBox="0 0 24 24"
54-
stroke="currentColor"
55-
>
56-
<path
57-
strokeLinecap="round"
58-
strokeLinejoin="round"
59-
strokeWidth={2}
60-
d="M21 13.255A23.931 23.931 0 0112 15c-3.183 0-6.22-.62-9-1.745M16 6V4a2 2 0 00-2-2h-4a2 2 0 00-2 2v2m4 6h.01M5 20h14a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"
61-
/>
62-
</svg>
63-
</div>
64-
<h4 className="text-xl font-bold mb-2">Reclutamiento</h4>
65-
<p>
66-
Acceso directo a talento especializado en Python, uno de los
67-
lenguajes más demandados en la industria tecnológica.
68-
</p>
69-
</div>
70-
<div className="bg-black/20 backdrop-blur p-6 rounded-lg text-center">
71-
<div className="bg-green-600 rounded-full h-14 w-14 flex items-center justify-center mx-auto mb-4">
72-
<svg
73-
xmlns="http://www.w3.org/2000/svg"
74-
className="h-8 w-8 text-white"
75-
fill="none"
76-
viewBox="0 0 24 24"
77-
stroke="currentColor"
78-
>
79-
<path
80-
strokeLinecap="round"
81-
strokeLinejoin="round"
82-
strokeWidth={2}
83-
d="M11 5.882V19.24a1.76 1.76 0 01-3.417.592l-2.147-6.15M18 13a3 3 0 100-6M5.436 13.683A4.001 4.001 0 017 6h1.832c4.1 0 7.625-1.234 9.168-3v14c-1.543-1.766-5.067-3-9.168-3H7a3.988 3.988 0 01-1.564-.317z"
84-
/>
85-
</svg>
46+
<h2 className="text-4xl font-bold text-center mb-16 text-white">
47+
<span className="border-b-4 border-[#4ADE80] pb-2">
48+
Ventajas Exclusivas
49+
</span>
50+
</h2>
51+
52+
<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
53+
{benefits.map((b, index) => (
54+
<div
55+
key={index}
56+
className="group relative p-8 rounded-2xl bg-gradient-to-b from-gray-800/30 to-gray-900/50 backdrop-blur-sm border border-gray-700 hover:border-[#4ADE80] transition-all"
57+
>
58+
<div className="absolute inset-0 rounded-2xl border-2 border-[#4ADE80] opacity-0 group-hover:opacity-30 transition-opacity pointer-events-none" />
59+
60+
<div className="w-14 h-14 mb-6 bg-[#4ADE80]/10 rounded-xl flex items-center justify-center">
61+
<svg
62+
className="w-8 h-8 text-[#4ADE80]"
63+
fill="none"
64+
stroke="currentColor"
65+
viewBox="0 0 24 24"
66+
>
67+
<path
68+
strokeLinecap="round"
69+
strokeLinejoin="round"
70+
strokeWidth="2"
71+
d="M13 10V3L4 14h7v7l9-11h-7z"
72+
/>
73+
</svg>
74+
</div>
75+
76+
<h3 className="text-2xl font-bold text-white mb-4">{b.title}</h3>
77+
<p className="text-gray-400 leading-relaxed">{b.description}</p>
8678
</div>
87-
<h4 className="text-xl font-bold mb-2">Comunidad</h4>
88-
<p>
89-
Contribuye al crecimiento de la comunidad open source y mejora tu
90-
reputación como empresa que apoya el desarrollo tecnológico en
91-
Chile.
92-
</p>
93-
</div>
79+
))}
9480
</div>
9581
</motion.section>
9682

@@ -99,100 +85,99 @@ export default function DynamicContent() {
9985
initial={{ opacity: 0 }}
10086
whileInView={{ opacity: 1 }}
10187
viewport={{ once: true }}
102-
className="container-py bg-black/10 backdrop-blur"
88+
className="py-12 md:py-16"
10389
>
104-
<div className="max-w-5xl mx-auto">
105-
<h2 className="section-title">Alcance del Evento</h2>
106-
<div className="grid grid-cols-1 md:grid-cols-3 gap-8 mt-12">
107-
<div className="text-center">
108-
<div className="text-4xl font-bold text-green-500 mb-2">300+</div>
109-
<p className="text-xl">Asistentes por sede</p>
110-
</div>
111-
<div className="text-center">
112-
<div className="text-4xl font-bold text-green-500 mb-2">3</div>
113-
<p className="text-xl">Ciudades en Chile</p>
114-
</div>
115-
<div className="text-center">
116-
<div className="text-4xl font-bold text-green-500 mb-2">20+</div>
117-
<p className="text-xl">Charlas y talleres</p>
90+
<div className="container mx-auto px-4">
91+
<div className="max-w-4xl mx-auto">
92+
<div className="text-center mb-12">
93+
<h2 className="text-3xl md:text-4xl font-bold text-white mb-4">
94+
<span className="border-b-4 border-[#4ADE80] pb-2">
95+
Impacto y Alcance
96+
</span>
97+
</h2>
98+
<p className="text-gray-400">Nuestra comunidad en números</p>
11899
</div>
119-
</div>
120-
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 mt-12">
121-
<div className="text-center">
122-
<div className="text-4xl font-bold text-green-500 mb-2">70%</div>
123-
<p className="text-xl">Profesionales del sector tecnológico</p>
100+
101+
{/* Metricas principales */}
102+
<div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5 gap-3 mb-8 md:mb-12">
103+
{Object.entries(audience).map(([key, value]) => (
104+
<div
105+
key={key}
106+
className="p-4 md:p-6 rounded-xl bg-gray-900/50 backdrop-blur-sm border border-gray-800 hover:border-[#4ADE80]/50 transition-colors"
107+
>
108+
<p className="text-2xl md:text-3xl font-bold text-[#4ADE80] mb-1">
109+
{value.toLocaleString()}
110+
<span className="text-[#FFD43B]">+</span>
111+
</p>
112+
<p className="text-xs md:text-sm text-gray-400 font-medium">
113+
{key === "x"
114+
? "Redes Sociales"
115+
: key.split(/(?=[A-Z])/).join(" ")}
116+
</p>
117+
</div>
118+
))}
124119
</div>
125-
<div className="text-center">
126-
<div className="text-4xl font-bold text-green-500 mb-2">2K+</div>
127-
<p className="text-xl">Seguidores en redes sociales</p>
120+
121+
{/* Estadísticas 2024 */}
122+
<div className="p-6 md:p-8 rounded-2xl bg-gray-900/30 backdrop-blur-sm">
123+
<h3 className="text-xl md:text-2xl font-bold text-center text-white mb-6 md:mb-8">
124+
Comparativa PyDay 2024
125+
</h3>
126+
127+
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
128+
{[
129+
{ label: "Vistas en vivo", value: eventStats2024.liveViews },
130+
{
131+
label: "Asistentes presenciales",
132+
value: eventStats2024.inPersonAttendees,
133+
},
134+
{
135+
label: "Ponentes expertos",
136+
value: eventStats2024.expertSpeakers,
137+
},
138+
].map((stat, index) => (
139+
<div
140+
key={index}
141+
className="p-4 rounded-xl bg-gradient-to-b from-[#4ADE80]/10 to-transparent"
142+
>
143+
<p className="text-3xl md:text-4xl font-bold text-[#FFD43B] mb-1">
144+
{stat.value.toLocaleString()}
145+
</p>
146+
<p className="text-sm md:text-base text-gray-400">
147+
{stat.label}
148+
</p>
149+
</div>
150+
))}
151+
</div>
128152
</div>
129153
</div>
130154
</div>
131155
</motion.section>
132156

133-
<SponsorshipPlans />
157+
{/* Planes de Patrocinio */}
158+
<SponsorshipPlans plans={plans} />
134159

135160
{/* Patrocinadores anteriores */}
136-
<SponsorList />
137-
138-
{/* Testimonios de patrocinadores */}
139-
<section className="container-py">
140-
<h2 className="section-title">Lo que dicen nuestros patrocinadores</h2>
141-
<div className="max-w-4xl mx-auto mt-12">
142-
<div className="grid grid-cols-1 md:grid-cols-2 gap-8">
143-
<div className="bg-black/20 backdrop-blur rounded-lg p-6">
144-
<p className="text-lg italic mb-4">
145-
"Patrocinar PyDay nos permitió conectar con desarrolladores
146-
talentosos y aumentar nuestra visibilidad en la comunidad Python
147-
de Chile. Definitivamente repetiremos la experiencia."
148-
</p>
149-
<div className="flex items-center">
150-
<div className="w-12 h-12 rounded-full bg-green-600 flex items-center justify-center mr-4">
151-
<span className="font-bold text-lg">AC</span>
152-
</div>
153-
<div>
154-
<p className="font-bold">Ana Contreras</p>
155-
<p className="text-sm opacity-80">CTO, TechSolutions Chile</p>
156-
</div>
157-
</div>
158-
</div>
159-
<div className="bg-black/20 backdrop-blur rounded-lg p-6">
160-
<p className="text-lg italic mb-4">
161-
"El retorno de inversión fue excelente. Logramos contactar con
162-
varios perfiles interesantes para nuestro equipo y posicionar
163-
nuestra marca entre profesionales del sector."
164-
</p>
165-
<div className="flex items-center">
166-
<div className="w-12 h-12 rounded-full bg-green-600 flex items-center justify-center mr-4">
167-
<span className="font-bold text-lg">PM</span>
168-
</div>
169-
<div>
170-
<p className="font-bold">Pablo Muñoz</p>
171-
<p className="text-sm opacity-80">
172-
Director de RRHH, DataSoft
173-
</p>
174-
</div>
175-
</div>
176-
</div>
177-
</div>
178-
</div>
179-
</section>
161+
<SponsorList sponsors={sponsorshipData.sponsors} />
180162

181-
<section id="contacto" className="container-py bg-black/20 backdrop-blur">
182-
<div className="max-w-xl mx-auto">
183-
<h2 className="section-title">¿Interesado en patrocinar?</h2>
184-
<div className="bg-black/20 backdrop-blur-md rounded-lg p-6">
185-
<SponsorForm />
163+
{/* Formulario de contacto */}
164+
<section id="contact-form" className="container mx-auto py-16 px-4">
165+
<div className="max-w-4xl mx-auto">
166+
<h2 className="text-3xl font-bold text-center mb-8 text-white">
167+
¿Interesado en patrocinar?
168+
</h2>
169+
<div className="p-12">
170+
<SponsorForm contactEmail={contact.email} />
186171
</div>
187172
</div>
188173
</section>
189174

190175
<CTAFinal
191-
title="¿Listo para formar parte de PyDay Chile 2025?"
192-
subtitle="Conviértete en parte fundamental de este evento que impulsa el desarrollo tecnológico en Chile"
193-
buttonText="Solicitar Información"
176+
title="Contáctanos"
177+
subtitle={`Escríbenos a ${contact.email} o visita ${contact.website}`}
178+
buttonText="Enviar mensaje"
179+
email={contact.email}
194180
/>
195-
196181
<FAQSection faqs={sponsorshipFAQs} />
197182
</>
198183
);

0 commit comments

Comments
 (0)