1 Commits

Author SHA1 Message Date
767e78036e Update src/app/page.tsx 2026-06-13 06:31:43 +00:00

View File

@@ -33,34 +33,20 @@ export default function LandingPage() {
<NavbarStyleCentered <NavbarStyleCentered
navItems={[ navItems={[
{ {
name: "Inicio", name: "Inicio", id: "#hero"},
id: "#hero",
},
{ {
name: "Productos", name: "Productos", id: "#products"},
id: "#products",
},
{ {
name: "Características", name: "Características", id: "#features"},
id: "#features",
},
{ {
name: "Opiniones", name: "Opiniones", id: "#testimonials"},
id: "#testimonials",
},
{ {
name: "FAQ", name: "FAQ", id: "#faq"},
id: "#faq",
},
{ {
name: "Contacto", name: "Contacto", id: "#contact"},
id: "#contact",
},
]} ]}
button={{ button={{
text: "Comprar Ahora", text: "Comprar Ahora", href: "#products"}}
href: "#products",
}}
brandName="Chacon Hatss" brandName="Chacon Hatss"
/> />
</div> </div>
@@ -71,13 +57,9 @@ export default function LandingPage() {
description="Estilo único, calidad inigualable. Descubre la gorra perfecta que define tu personalidad y eleva tu look diario con nuestras colecciones exclusivas." description="Estilo único, calidad inigualable. Descubre la gorra perfecta que define tu personalidad y eleva tu look diario con nuestras colecciones exclusivas."
buttons={[ buttons={[
{ {
text: "Comprar Ahora", text: "Comprar Ahora", href: "#products"},
href: "#products",
},
{ {
text: "Nuestra Historia", text: "Nuestra Historia", href: "#about"},
href: "#about",
},
]} ]}
buttonAnimation="slide-up" buttonAnimation="slide-up"
imageSrc="http://img.b2bpic.net/free-photo/traveler-posinng-with-sun-glasses-palm-trees_23-2147641188.jpg" imageSrc="http://img.b2bpic.net/free-photo/traveler-posinng-with-sun-glasses-palm-trees_23-2147641188.jpg"
@@ -95,9 +77,7 @@ export default function LandingPage() {
title="Más que gorras, una declaración de estilo" title="Más que gorras, una declaración de estilo"
buttons={[ buttons={[
{ {
text: "Ver Colección", text: "Ver Colección", href: "#products"},
href: "#products",
},
]} ]}
buttonAnimation="slide-up" buttonAnimation="slide-up"
/> />
@@ -111,47 +91,17 @@ export default function LandingPage() {
useInvertedBackground={false} useInvertedBackground={false}
products={[ products={[
{ {
id: "1", id: "1", name: "Gorra Clásica Negra", price: "€29.99", imageSrc: "http://img.b2bpic.net/free-photo/mature-woman-posing-studio_176474-73026.jpg", imageAlt: "Gorra Clásica Negra"},
name: "Gorra Clásica Negra",
price: "€29.99",
imageSrc: "http://img.b2bpic.net/free-photo/mature-woman-posing-studio_176474-73026.jpg",
imageAlt: "Gorra Clásica Negra",
},
{ {
id: "2", id: "2", name: "Gorra Denim Vintage", price: "€34.99", imageSrc: "http://img.b2bpic.net/free-photo/musician-with-cowboy-hat-guitar_23-2147782083.jpg", imageAlt: "Gorra Denim Vintage"},
name: "Gorra Denim Vintage",
price: "€34.99",
imageSrc: "http://img.b2bpic.net/free-photo/musician-with-cowboy-hat-guitar_23-2147782083.jpg",
imageAlt: "Gorra Denim Vintage",
},
{ {
id: "3", id: "3", name: "Gorra Blanca Urbana", price: "€27.99", imageSrc: "http://img.b2bpic.net/free-photo/surprised-young-handsome-guy-cap-wearing-headphones-isolated-blue-background_141793-134718.jpg", imageAlt: "Gorra Blanca Urbana"},
name: "Gorra Blanca Urbana",
price: "€27.99",
imageSrc: "http://img.b2bpic.net/free-photo/surprised-young-handsome-guy-cap-wearing-headphones-isolated-blue-background_141793-134718.jpg",
imageAlt: "Gorra Blanca Urbana",
},
{ {
id: "4", id: "4", name: "Gorra Gráfica Atrevida", price: "€39.99", imageSrc: "http://img.b2bpic.net/free-photo/creative-trucker-hat-still-life_23-2149504559.jpg", imageAlt: "Gorra Gráfica Atrevida"},
name: "Gorra Gráfica Atrevida",
price: "€39.99",
imageSrc: "http://img.b2bpic.net/free-photo/creative-trucker-hat-still-life_23-2149504559.jpg",
imageAlt: "Gorra Gráfica Atrevida",
},
{ {
id: "5", id: "5", name: "Gorra Bucket Beige", price: "€32.99", imageSrc: "http://img.b2bpic.net/free-photo/fashionable-fedora-hat-studio_23-2150737136.jpg", imageAlt: "Gorra Bucket Beige"},
name: "Gorra Bucket Beige",
price: "€32.99",
imageSrc: "http://img.b2bpic.net/free-photo/fashionable-fedora-hat-studio_23-2150737136.jpg",
imageAlt: "Gorra Bucket Beige",
},
{ {
id: "6", id: "6", name: "Gorra Deportiva Roja", price: "€28.99", imageSrc: "http://img.b2bpic.net/free-photo/delivery-woman-with-coffees-holding-her-cap-high-quality-photo_114579-52888.jpg", imageAlt: "Gorra Deportiva Roja"},
name: "Gorra Deportiva Roja",
price: "€28.99",
imageSrc: "http://img.b2bpic.net/free-photo/delivery-woman-with-coffees-holding-her-cap-high-quality-photo_114579-52888.jpg",
imageAlt: "Gorra Deportiva Roja",
},
]} ]}
title="Descubre Tu Gorra Ideal" title="Descubre Tu Gorra Ideal"
description="Explora nuestra exclusiva colección de gorras diseñadas para cada estilo y ocasión. Cada pieza es una obra de arte, lista para complementar tu personalidad." description="Explora nuestra exclusiva colección de gorras diseñadas para cada estilo y ocasión. Cada pieza es una obra de arte, lista para complementar tu personalidad."
@@ -166,23 +116,11 @@ export default function LandingPage() {
useInvertedBackground={true} useInvertedBackground={true}
features={[ features={[
{ {
title: "Materiales Duraderos", title: "Materiales Duraderos", description: "Seleccionamos tejidos de la más alta calidad para garantizar resistencia y una vida útil prolongada.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-worker-wearing-helmet_23-2149328046.jpg", imageAlt: "Detalle de costura de alta calidad en una gorra"},
description: "Seleccionamos tejidos de la más alta calidad para garantizar resistencia y una vida útil prolongada.",
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-worker-wearing-helmet_23-2149328046.jpg",
imageAlt: "Detalle de costura de alta calidad en una gorra",
},
{ {
title: "Confort Inigualable", title: "Confort Inigualable", description: "Diseñadas para un ajuste perfecto y una comodidad excepcional durante todo el día, sin importar la actividad.", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-wearing-trucker-hat_23-2149432365.jpg", imageAlt: "Persona ajustándose una gorra cómoda"},
description: "Diseñadas para un ajuste perfecto y una comodidad excepcional durante todo el día, sin importar la actividad.",
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-wearing-trucker-hat_23-2149432365.jpg",
imageAlt: "Persona ajustándose una gorra cómoda",
},
{ {
title: "Diseños Exclusivos", title: "Diseños Exclusivos", description: "Cada gorra es una pieza única, con estilos que van desde lo clásico hasta las últimas tendencias de moda.", imageSrc: "http://img.b2bpic.net/free-photo/african-american-woman-violet-dress-cap-posed-outdoor-against-brick-tonel_627829-2093.jpg", imageAlt: "Persona con una gorra de diseño elegante"},
description: "Cada gorra es una pieza única, con estilos que van desde lo clásico hasta las últimas tendencias de moda.",
imageSrc: "http://img.b2bpic.net/free-photo/african-american-woman-violet-dress-cap-posed-outdoor-against-brick-tonel_627829-2093.jpg",
imageAlt: "Persona con una gorra de diseño elegante",
},
]} ]}
title="La Excelencia en Cada Detalle" title="La Excelencia en Cada Detalle"
description="Nuestras gorras no solo visten, sino que cuentan una historia de calidad y diseño superior. Descubre lo que nos hace únicos." description="Nuestras gorras no solo visten, sino que cuentan una historia de calidad y diseño superior. Descubre lo que nos hace únicos."
@@ -197,14 +135,7 @@ export default function LandingPage() {
textboxLayout="default" textboxLayout="default"
useInvertedBackground={false} useInvertedBackground={false}
names={[ names={[
"Vogue Estilo Urbano", "Vogue Estilo Urbano", "GQ Accesorios", "Moda Callejera Mag.", "Trendsetter Weekly", "Estilo Influencer", "Urban Wear Co.", "Fashion Forward Blog"]}
"GQ Accesorios",
"Moda Callejera Mag.",
"Trendsetter Weekly",
"Estilo Influencer",
"Urban Wear Co.",
"Fashion Forward Blog",
]}
title="Reconocidos por la comunidad de la moda" title="Reconocidos por la comunidad de la moda"
description="Nuestras gorras son elegidas y destacadas por figuras y publicaciones influyentes en el mundo de la moda y el estilo urbano. Únete a una comunidad que valora la autenticidad y el buen gusto." description="Nuestras gorras son elegidas y destacadas por figuras y publicaciones influyentes en el mundo de la moda y el estilo urbano. Únete a una comunidad que valora la autenticidad y el buen gusto."
tag="Respaldo del Estilo" tag="Respaldo del Estilo"
@@ -219,64 +150,28 @@ export default function LandingPage() {
useInvertedBackground={true} useInvertedBackground={true}
testimonials={[ testimonials={[
{ {
id: "1", id: "1", name: "Sofía García", role: "Diseñadora Gráfica", company: "Creativa Digital", rating: 5,
name: "Sofía García", imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-calm-cute-girl-with-pandora-silver-bracelet-with-charms-lady-with-plump-lips-gently_197531-11982.jpg", imageAlt: "Sofía García"},
role: "Diseñadora Gráfica",
company: "Creativa Digital",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-calm-cute-girl-with-pandora-silver-bracelet-with-charms-lady-with-plump-lips-gently_197531-11982.jpg",
imageAlt: "Sofía García",
},
{ {
id: "2", id: "2", name: "Carlos Rodríguez", role: "Músico", company: "Ritmo Urbano", rating: 5,
name: "Carlos Rodríguez", imageSrc: "http://img.b2bpic.net/free-photo/man-posing-with-trucker-hat-side-view_23-2149410267.jpg", imageAlt: "Carlos Rodríguez"},
role: "Músico",
company: "Ritmo Urbano",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/man-posing-with-trucker-hat-side-view_23-2149410267.jpg",
imageAlt: "Carlos Rodríguez",
},
{ {
id: "3", id: "3", name: "Elena Martínez", role: "Fotógrafa", company: "Lente Creativo", rating: 5,
name: "Elena Martínez", imageSrc: "http://img.b2bpic.net/free-photo/woman-wears-red-hat-red-background_633478-2599.jpg", imageAlt: "Elena Martínez"},
role: "Fotógrafa",
company: "Lente Creativo",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/woman-wears-red-hat-red-background_633478-2599.jpg",
imageAlt: "Elena Martínez",
},
{ {
id: "4", id: "4", name: "David Sánchez", role: "Emprendedor", company: "Innovador Tech", rating: 5,
name: "David Sánchez", imageSrc: "http://img.b2bpic.net/free-photo/portrait-serious-bearded-male-hip-hop-clothes-grey-background_613910-615.jpg", imageAlt: "David Sánchez"},
role: "Emprendedor",
company: "Innovador Tech",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-serious-bearded-male-hip-hop-clothes-grey-background_613910-615.jpg",
imageAlt: "David Sánchez",
},
{ {
id: "5", id: "5", name: "Laura Pérez", role: "Estudiante", company: "Universidad Global", rating: 5,
name: "Laura Pérez", imageSrc: "http://img.b2bpic.net/free-photo/small-pearl-earrings-attract-attention-portrait-young-fashion-blogger-girl-with-sweet-smile-coquettishly-touches-her-black-cap_197531-11969.jpg", imageAlt: "Laura Pérez"},
role: "Estudiante",
company: "Universidad Global",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/small-pearl-earrings-attract-attention-portrait-young-fashion-blogger-girl-with-sweet-smile-coquettishly-touches-her-black-cap_197531-11969.jpg",
imageAlt: "Laura Pérez",
},
]} ]}
kpiItems={[ kpiItems={[
{ {
value: "4.9/5", value: "4.9/5", label: "Valoración Promedio"},
label: "Valoración Promedio",
},
{ {
value: "100K+", value: "100K+", label: "Clientes Felices"},
label: "Clientes Felices",
},
{ {
value: "98%", value: "98%", label: "Recompra"},
label: "Recompra",
},
]} ]}
title="Lo Que Dicen Nuestros Clientes" title="Lo Que Dicen Nuestros Clientes"
description="La satisfacción de quienes usan nuestras gorras es nuestra mayor inspiración. Conoce las experiencias de nuestra comunidad Chacon Hatss." description="La satisfacción de quienes usan nuestras gorras es nuestra mayor inspiración. Conoce las experiencias de nuestra comunidad Chacon Hatss."
@@ -288,35 +183,23 @@ export default function LandingPage() {
useInvertedBackground={false} useInvertedBackground={false}
faqs={[ faqs={[
{ {
id: "1", id: "1", title: "¿Cuáles son las opciones de envío?", content: "Ofrecemos envío estándar y exprés a nivel nacional e internacional. Los tiempos de entrega y costos varían según el destino. Puedes consultar los detalles al finalizar tu compra."},
title: "¿Cuáles son las opciones de envío?",
content: "Ofrecemos envío estándar y exprés a nivel nacional e internacional. Los tiempos de entrega y costos varían según el destino. Puedes consultar los detalles al finalizar tu compra.",
},
{ {
id: "2", id: "2", title: "¿Cuál es su política de devoluciones?", content: "Aceptamos devoluciones de productos sin usar en su empaque original dentro de los 30 días posteriores a la compra. El reembolso se procesará una vez que hayamos recibido y verificado el artículo."},
title: "¿Cuál es su política de devoluciones?",
content: "Aceptamos devoluciones de productos sin usar en su empaque original dentro de los 30 días posteriores a la compra. El reembolso se procesará una vez que hayamos recibido y verificado el artículo.",
},
{ {
id: "3", id: "3", title: "¿Cómo elijo la talla correcta de mi gorra?", content: "Nuestras gorras tienen un diseño de talla única ajustable. La mayoría se adaptan cómodamente a circunferencias de cabeza entre 55-60 cm. En la descripción de cada producto encontrarás más detalles sobre su ajuste."},
title: "¿Cómo elijo la talla correcta de mi gorra?",
content: "Nuestras gorras tienen un diseño de talla única ajustable. La mayoría se adaptan cómodamente a circunferencias de cabeza entre 55-60 cm. En la descripción de cada producto encontrarás más detalles sobre su ajuste.",
},
{ {
id: "4", id: "4", title: "¿Cómo cuido mi gorra para que dure más?", content: "Recomendamos lavar a mano con agua fría y jabón suave. Evita el uso de blanqueadores y secar en secadora. Déjala secar al aire libre para mantener su forma y colores vibrantes."},
title: "¿Cómo cuido mi gorra para que dure más?",
content: "Recomendamos lavar a mano con agua fría y jabón suave. Evita el uso de blanqueadores y secar en secadora. Déjala secar al aire libre para mantener su forma y colores vibrantes.",
},
{ {
id: "5", id: "5", title: "¿Ofrecen personalización de gorras?", content: "Actualmente no ofrecemos servicios de personalización para pedidos individuales. Sin embargo, para pedidos al por mayor o colaboraciones especiales, contáctanos directamente para explorar las posibilidades."},
title: "¿Ofrecen personalización de gorras?",
content: "Actualmente no ofrecemos servicios de personalización para pedidos individuales. Sin embargo, para pedidos al por mayor o colaboraciones especiales, contáctanos directamente para explorar las posibilidades.",
},
]} ]}
sideTitle="Preguntas Frecuentes" sideTitle="Preguntas Frecuentes"
sideDescription="Encuentra respuestas rápidas a las dudas más comunes sobre nuestras gorras, proceso de compra, envíos y devoluciones. Si no encuentras lo que buscas, no dudes en contactarnos." sideDescription="Encuentra respuestas rápidas a las dudas más comunes sobre nuestras gorras, proceso de compra, envíos y devoluciones. Si no encuentras lo que buscas, no dudes en contactarnos."
faqsAnimation="slide-up" faqsAnimation="slide-up"
textPosition="left" textPosition="left"
contentClassName="lg:gap-16"
sideTitleClassName="text-3xl lg:text-4xl font-extrabold"
sideDescriptionClassName="text-lg text-foreground/80"
/> />
</div> </div>
@@ -324,19 +207,16 @@ export default function LandingPage() {
<ContactText <ContactText
useInvertedBackground={true} useInvertedBackground={true}
background={{ background={{
variant: "radial-gradient", variant: "radial-gradient"}}
}}
text="Contacta con Nosotros. Estamos aquí para ayudarte a encontrar tu gorra perfecta o resolver cualquier duda." text="Contacta con Nosotros. Estamos aquí para ayudarte a encontrar tu gorra perfecta o resolver cualquier duda."
buttons={[ buttons={[
{ {
text: "Enviar Mensaje", text: "Enviar Mensaje", href: "mailto:info@chaconhatss.com"},
href: "mailto:info@chaconhatss.com",
},
{ {
text: "WhatsApp", text: "WhatsApp", href: "https://wa.me/1234567890"},
href: "https://wa.me/1234567890",
},
]} ]}
contentClassName="p-6 lg:p-10 rounded-xl"
textClassName="text-3xl lg:text-5xl font-extrabold leading-tight"
/> />
</div> </div>
@@ -344,13 +224,12 @@ export default function LandingPage() {
<FooterLogoReveal <FooterLogoReveal
logoText="Chacon Hatss" logoText="Chacon Hatss"
leftLink={{ leftLink={{
text: "Política de Privacidad", text: "Política de Privacidad", href: "#"}}
href: "#",
}}
rightLink={{ rightLink={{
text: "Términos y Condiciones", text: "Términos y Condiciones", href: "#"}}
href: "#", logoSrc="http://img.b2bpic.net/free-photo/traveler-posinng-with-sun-glasses-palm-trees_23-2147641188.jpg"
}} logoAlt="Chacon Hatss Logo"
wrapperClassName="py-16 lg:py-24"
/> />
</div> </div>
</ReactLenis> </ReactLenis>