Update src/app/page.tsx
This commit is contained in:
182
src/app/page.tsx
182
src/app/page.tsx
@@ -11,7 +11,7 @@ import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
||||
import { Calendar, LifeBuoy, ShieldCheck, Trophy, Utensils } from "lucide-react";
|
||||
import { Calendar, LifeBuoy, ShieldCheck, Trophy, Utensils, Ship, ShowerHead } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -31,22 +31,10 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Inicio",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Sobre el Evento",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "FAQ",
|
||||
id: "faq",
|
||||
},
|
||||
{
|
||||
name: "Contacto",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Inicio", id: "hero" },
|
||||
{ name: "Sobre el Evento", id: "about" },
|
||||
{ name: "FAQ", id: "faq" },
|
||||
{ name: "Contacto", id: "contact" },
|
||||
]}
|
||||
brandName="La Traversata Melilla"
|
||||
/>
|
||||
@@ -54,18 +42,11 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
background={{ variant: "plain" }}
|
||||
title="La Traversata de Melilla"
|
||||
description="El desafío de natación en aguas abiertas más emblemático del Mediterráneo. Únete a una experiencia única que une deporte, resistencia y el mar de Melilla."
|
||||
tag="Edición 2024"
|
||||
buttons={[
|
||||
{
|
||||
text: "Inscribirse",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Inscribirse", href: "#contact" }]}
|
||||
tagIcon={Calendar}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/active-young-lady-enjoying-swimming_23-2148699951.jpg?_wi=1"
|
||||
imageAlt="swimming marathon open sea"
|
||||
@@ -77,9 +58,7 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
title="Un Reto Histórico"
|
||||
description={[
|
||||
"La Traversata de Melilla no es solo una competición, es una celebración de la natación en aguas abiertas. Cada año, nadadores de toda España se reúnen para recorrer las aguas que rodean nuestra ciudad.",
|
||||
"Nuestro evento combina un entorno marino incomparable con una organización técnica de primer nivel, garantizando seguridad y disfrute para cada participante.",
|
||||
]}
|
||||
"La Traversata de Melilla no es solo una competición, es una celebración de la natación en aguas abiertas. Cada año, nadadores de toda España se reúnen para recorrer las aguas que rodean nuestra ciudad.", "Nuestro evento combina un entorno marino incomparable con una organización técnica de primer nivel, garantizando seguridad y disfrute para cada participante."]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -89,21 +68,9 @@ export default function LandingPage() {
|
||||
title="Datos del Evento"
|
||||
tag="Estadísticas"
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "15km",
|
||||
description: "Recorrido Total",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "300+",
|
||||
description: "Participantes",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "20+",
|
||||
description: "Ediciones",
|
||||
},
|
||||
{ id: "m1", value: "15km", description: "Recorrido Total" },
|
||||
{ id: "m2", value: "300+", description: "Participantes" },
|
||||
{ id: "m3", value: "20+", description: "Ediciones" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
@@ -116,54 +83,22 @@ export default function LandingPage() {
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Seguridad en el mar",
|
||||
description: "Contamos con embarcaciones de apoyo y equipos médicos en toda la ruta.",
|
||||
media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/dog-having-fun-beach_23-2149563960.jpg",
|
||||
imageAlt: "Equipo de seguridad",
|
||||
},
|
||||
title: "Seguridad en el mar", description: "Contamos con embarcaciones de apoyo y equipos médicos en toda la ruta.", media: { imageSrc: "http://img.b2bpic.net/free-photo/dog-having-fun-beach_23-2149563960.jpg", imageAlt: "Equipo de seguridad" },
|
||||
items: [
|
||||
{
|
||||
icon: LifeBuoy,
|
||||
text: "Socorristas certificados",
|
||||
},
|
||||
{
|
||||
icon: Ship,
|
||||
text: "Embarcaciones de apoyo",
|
||||
},
|
||||
{
|
||||
icon: ShieldCheck,
|
||||
text: "Protocolo de emergencias",
|
||||
},
|
||||
{ icon: LifeBuoy, text: "Socorristas certificados" },
|
||||
{ icon: Ship, text: "Embarcaciones de apoyo" },
|
||||
{ icon: ShieldCheck, text: "Protocolo de emergencias" },
|
||||
],
|
||||
reverse: false,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/active-young-lady-enjoying-swimming_23-2148699951.jpg?_wi=2",
|
||||
imageAlt: "swimmers arriving beach melilla",
|
||||
},
|
||||
{
|
||||
title: "Zona de Transición",
|
||||
description: "Instalaciones de primer nivel para tu preparación antes y después del reto.",
|
||||
media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-catching-frisbee-flying-from-friend-beach_23-2148179983.jpg",
|
||||
imageAlt: "Zona de nadadores",
|
||||
},
|
||||
title: "Zona de Transición", description: "Instalaciones de primer nivel para tu preparación antes y después del reto.", media: { imageSrc: "http://img.b2bpic.net/free-photo/man-catching-frisbee-flying-from-friend-beach_23-2148179983.jpg", imageAlt: "Zona de nadadores" },
|
||||
items: [
|
||||
{
|
||||
icon: Trophy,
|
||||
text: "Entrega de medallas",
|
||||
},
|
||||
{
|
||||
icon: ShowerHead,
|
||||
text: "Zona de duchas",
|
||||
},
|
||||
{
|
||||
icon: Utensils,
|
||||
text: "Avituallamiento completo",
|
||||
},
|
||||
{ icon: Trophy, text: "Entrega de medallas" },
|
||||
{ icon: ShowerHead, text: "Zona de duchas" },
|
||||
{ icon: Utensils, text: "Avituallamiento completo" },
|
||||
],
|
||||
reverse: true,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blue-plastic-baby-boy-essentials-collection_58702-17446.jpg?_wi=1",
|
||||
imageAlt: "swimmers arriving beach melilla",
|
||||
},
|
||||
]}
|
||||
title="Por qué participar"
|
||||
@@ -176,14 +111,7 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"Gobierno de Melilla",
|
||||
"Federación de Natación",
|
||||
"Banco Local",
|
||||
"Deportes Agua",
|
||||
"Turismo Melilla",
|
||||
"Radio Nacional",
|
||||
"Club de Natación",
|
||||
]}
|
||||
"Gobierno de Melilla", "Federación de Natación", "Banco Local", "Deportes Agua", "Turismo Melilla", "Radio Nacional", "Club de Natación"]}
|
||||
title="Nuestros Patrocinadores"
|
||||
description="Gracias a todos los que hacen posible este evento año tras año."
|
||||
tag="Colaboradores"
|
||||
@@ -195,86 +123,36 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "¿Cuándo se celebra?",
|
||||
content: "La fecha se anuncia siempre en primavera tras la coordinación con capitanía marítima.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "¿Qué nivel se requiere?",
|
||||
content: "Es necesario tener experiencia previa en aguas abiertas y certificado médico.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "¿Hay categorías?",
|
||||
content: "Sí, tenemos categorías por edad, sexo y modalidad.",
|
||||
},
|
||||
{
|
||||
id: "f4",
|
||||
title: "¿Es obligatorio el neopreno?",
|
||||
content: "Dependerá de la temperatura del agua según normativa vigente.",
|
||||
},
|
||||
{
|
||||
id: "f5",
|
||||
title: "¿Cómo me inscribo?",
|
||||
content: "A través de nuestro formulario en línea cuando se abre el plazo.",
|
||||
},
|
||||
{ id: "f1", title: "¿Cuándo se celebra?", content: "La fecha se anuncia siempre en primavera tras la coordinación con capitanía marítima." },
|
||||
{ id: "f2", title: "¿Qué nivel se requiere?", content: "Es necesario tener experiencia previa en aguas abiertas y certificado médico." },
|
||||
{ id: "f3", title: "¿Hay categorías?", content: "Sí, tenemos categorías por edad, sexo y modalidad." },
|
||||
{ id: "f4", title: "¿Es obligatorio el neopreno?", content: "Dependerá de la temperatura del agua según normativa vigente." },
|
||||
{ id: "f5", title: "¿Cómo me inscribo?", content: "A través de nuestro formulario en línea cuando se abre el plazo." },
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
title="Preguntas Frecuentes"
|
||||
description="Resolvemos tus dudas sobre la participación."
|
||||
faqsAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/blue-plastic-baby-boy-essentials-collection_58702-17446.jpg?_wi=2"
|
||||
imageAlt="Preparación de equipo de natación"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Inscripciones"
|
||||
title="¡Únete a la Traversata!"
|
||||
description="Si tienes cualquier consulta o quieres ser parte de la próxima edición, escríbenos."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contactar ahora",
|
||||
href: "mailto:info@traversatamelilla.es",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Contactar ahora", href: "mailto:info@traversatamelilla.es" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Inicio",
|
||||
href: "#hero",
|
||||
},
|
||||
{
|
||||
label: "Sobre Nosotros",
|
||||
href: "#about",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Política de Privacidad",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Aviso Legal",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{ items: [{ label: "Inicio", href: "#hero" }, { label: "Sobre Nosotros", href: "#about" }] },
|
||||
{ items: [{ label: "Política de Privacidad", href: "#" }, { label: "Aviso Legal", href: "#" }] },
|
||||
]}
|
||||
logoText="La Traversata Melilla"
|
||||
/>
|
||||
@@ -282,4 +160,4 @@ export default function LandingPage() {
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user