Merge version_1 into main #1
418
src/app/page.tsx
418
src/app/page.tsx
@@ -28,305 +28,143 @@ export default function LandingPage() {
|
||||
headingFontWeight="light"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Projects",
|
||||
id: "products",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="MayaRemodels"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Projects", id: "products" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="MayaRemodels"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Renovando la Esencia de tu Hogar"
|
||||
description="Transformamos espacios en la Riviera Maya con diseño de vanguardia y acabados de lujo."
|
||||
buttons={[
|
||||
{
|
||||
text: "Cotizar Proyecto",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/graceful-happy-woman-sitting-window-sill-playing-with-her-blonde-hair_197531-20597.jpg",
|
||||
imageAlt: "luxury villa renovation tropical",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/photorealistic-timber-house-interior-with-wooden-decor-furnishings_23-2151263606.jpg",
|
||||
imageAlt: "beach villa renovation mexico",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-kitchen-interior-design_23-2150771883.jpg",
|
||||
imageAlt: "luxury kitchen remodeling interior",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/minimalist-interior-with-wooden-accents-natural-light_23-2152016397.jpg",
|
||||
imageAlt: "coastal living room renovation",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-bathtub-with-faucet_1203-1500.jpg",
|
||||
imageAlt: "luxury bathroom remodel stone textures",
|
||||
},
|
||||
]}
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Renovando la Esencia de tu Hogar"
|
||||
description="Transformamos espacios en la Riviera Maya con diseño de vanguardia y acabados de lujo."
|
||||
buttons={[{ text: "Cotizar Proyecto", href: "#contact" }]}
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/graceful-happy-woman-sitting-window-sill-playing-with-her-blonde-hair_197531-20597.jpg", imageAlt: "luxury villa renovation tropical" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/photorealistic-timber-house-interior-with-wooden-decor-furnishings_23-2151263606.jpg", imageAlt: "beach villa renovation mexico" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/modern-kitchen-interior-design_23-2150771883.jpg", imageAlt: "luxury kitchen remodeling interior" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/minimalist-interior-with-wooden-accents-natural-light_23-2152016397.jpg", imageAlt: "coastal living room renovation" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-bathtub-with-faucet_1203-1500.jpg", imageAlt: "luxury bathroom remodel stone textures" }
|
||||
]}
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TextAbout
|
||||
useInvertedBackground={false}
|
||||
title="Pasión por los Espacios"
|
||||
buttons={[
|
||||
{
|
||||
text: "Conoce Nuestro Proceso",
|
||||
href: "#process",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TextAbout
|
||||
useInvertedBackground={false}
|
||||
title="Pasión por los Espacios"
|
||||
buttons={[{ text: "Conoce Nuestro Proceso", href: "#process" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardSix
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Diseño de Interiores",
|
||||
description: "Espacios personalizados con estilo costero contemporáneo.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/home-interior-design-arrangement_23-2148986618.jpg",
|
||||
imageAlt: "Home interior design arrangement",
|
||||
},
|
||||
{
|
||||
title: "Remodelaciones Completas",
|
||||
description: "Actualizamos estructuras para maximizar valor y confort.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920918.jpg",
|
||||
imageAlt: "Luxury architecture exterior design",
|
||||
},
|
||||
{
|
||||
title: "Acabados de Lujo",
|
||||
description: "Materiales premium seleccionados para durabilidad.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/elegant-green-bathroom-with-vanity-mirror-toilet_23-2151986769.jpg",
|
||||
imageAlt: "Elegant green bathroom with vanity, mirror, and toilet",
|
||||
},
|
||||
]}
|
||||
title="Nuestros Servicios"
|
||||
description="Soluciones integrales de construcción y diseño para tu propiedad."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardSix
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{ title: "Diseño de Interiores", description: "Espacios personalizados con estilo costero contemporáneo.", imageSrc: "http://img.b2bpic.net/free-photo/home-interior-design-arrangement_23-2148986618.jpg", imageAlt: "Home interior design arrangement" },
|
||||
{ title: "Remodelaciones Completas", description: "Actualizamos estructuras para maximizar valor y confort.", imageSrc: "http://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920918.jpg", imageAlt: "Luxury architecture exterior design" },
|
||||
{ title: "Acabados de Lujo", description: "Materiales premium seleccionados para durabilidad.", imageSrc: "http://img.b2bpic.net/free-photo/elegant-green-bathroom-with-vanity-mirror-toilet_23-2151986769.jpg", imageAlt: "Elegant green bathroom with vanity, mirror, and toilet" }
|
||||
]}
|
||||
title="Nuestros Servicios"
|
||||
description="Soluciones integrales de construcción y diseño para tu propiedad."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Villa Tulum Kitchen",
|
||||
price: "Desde $15k",
|
||||
variant: "Kitchen",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-shot-modern-house-kitchen_181624-4007.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Akumal Patio & Pool",
|
||||
price: "Desde $25k",
|
||||
variant: "Exterior",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-luxury-swimming-pool-with-palm-trees-thai-style-decoration_1258-111445.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Playa Apartment Living",
|
||||
price: "Desde $12k",
|
||||
variant: "Living",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/people-table-working-together_23-2147668789.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Master Suite SPA",
|
||||
price: "Desde $8k",
|
||||
variant: "Bathroom",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-sink-black-faucet-marble-countertop_169016-69284.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Facade Modernization",
|
||||
price: "Desde $20k",
|
||||
variant: "Exterior",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/old-roof-architecture-quebec-city_649448-2146.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Penthouse Suite Renovation",
|
||||
price: "Desde $30k",
|
||||
variant: "Interior",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cozy-bedroom-interior-with-modern-art_23-2152001406.jpg",
|
||||
},
|
||||
]}
|
||||
title="Proyectos Recientes"
|
||||
description="Explora nuestra transformación de espacios reales."
|
||||
/>
|
||||
</div>
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardFour
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "p1", name: "Villa Tulum Kitchen", price: "Desde $15k", variant: "Kitchen", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-shot-modern-house-kitchen_181624-4007.jpg" },
|
||||
{ id: "p2", name: "Akumal Patio & Pool", price: "Desde $25k", variant: "Exterior", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-luxury-swimming-pool-with-palm-trees-thai-style-decoration_1258-111445.jpg" },
|
||||
{ id: "p3", name: "Playa Apartment Living", price: "Desde $12k", variant: "Living", imageSrc: "http://img.b2bpic.net/free-photo/people-table-working-together_23-2147668789.jpg" },
|
||||
{ id: "p4", name: "Master Suite SPA", price: "Desde $8k", variant: "Bathroom", imageSrc: "http://img.b2bpic.net/free-photo/modern-sink-black-faucet-marble-countertop_169016-69284.jpg" },
|
||||
{ id: "p5", name: "Facade Modernization", price: "Desde $20k", variant: "Exterior", imageSrc: "http://img.b2bpic.net/free-photo/old-roof-architecture-quebec-city_649448-2146.jpg" },
|
||||
{ id: "p6", name: "Penthouse Suite Renovation", price: "Desde $30k", variant: "Interior", imageSrc: "http://img.b2bpic.net/free-photo/cozy-bedroom-interior-with-modern-art_23-2152001406.jpg" }
|
||||
]}
|
||||
title="Proyectos Recientes"
|
||||
description="Explora nuestra transformación de espacios reales."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonial" data-section="testimonial">
|
||||
<TestimonialCardTwo
|
||||
animationType="depth-3d"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah Miller",
|
||||
role: "Propietaria",
|
||||
testimonial: "Excelente servicio, transformaron mi casa en un paraíso.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-middle-age-man-holding-screwdriver-new-home-mouth-lips-shut-as-zip-with-fingers-secret-silent-taboo-talking_839833-5351.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "John Doe",
|
||||
role: "Inversionista",
|
||||
testimonial: "Profesionales y detallistas, superaron mis expectativas.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-female-realtor-with-young-couple-embracing-background_23-2148895450.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Elena Gomez",
|
||||
role: "Cliente",
|
||||
testimonial: "La mejor opción para remodelar en la Riviera.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-man-virtual-glasses-front-new-house_493343-29857.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Marc Smith",
|
||||
role: "Cliente",
|
||||
testimonial: "Increíble transformación, quedé muy satisfecho.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/enjoying-morning-sun-before-start-work_329181-11779.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Ana Rodriguez",
|
||||
role: "Propietaria",
|
||||
testimonial: "Calidad inigualable y cumplimiento en tiempo.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-man-choosing-color_23-2148903521.jpg",
|
||||
},
|
||||
]}
|
||||
title="Lo que dicen nuestros clientes"
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonial" data-section="testimonial">
|
||||
<TestimonialCardTwo
|
||||
animationType="depth-3d"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
title="Lo que dicen nuestros clientes"
|
||||
description="Testimonios de nuestros clientes satisfechos."
|
||||
testimonials={[
|
||||
{ id: "1", name: "Sarah Miller", role: "Propietaria", testimonial: "Excelente servicio, transformaron mi casa en un paraíso.", imageSrc: "http://img.b2bpic.net/free-photo/handsome-middle-age-man-holding-screwdriver-new-home-mouth-lips-shut-as-zip-with-fingers-secret-silent-taboo-talking_839833-5351.jpg" },
|
||||
{ id: "2", name: "John Doe", role: "Inversionista", testimonial: "Profesionales y detallistas, superaron mis expectativas.", imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-female-realtor-with-young-couple-embracing-background_23-2148895450.jpg" },
|
||||
{ id: "3", name: "Elena Gomez", role: "Cliente", testimonial: "La mejor opción para remodelar en la Riviera.", imageSrc: "http://img.b2bpic.net/free-photo/cheerful-man-virtual-glasses-front-new-house_493343-29857.jpg" },
|
||||
{ id: "4", name: "Marc Smith", role: "Cliente", testimonial: "Increíble transformación, quedé muy satisfecho.", imageSrc: "http://img.b2bpic.net/free-photo/enjoying-morning-sun-before-start-work_329181-11779.jpg" },
|
||||
{ id: "5", name: "Ana Rodriguez", role: "Propietaria", testimonial: "Calidad inigualable y cumplimiento en tiempo.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-man-choosing-color_23-2148903521.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="process" data-section="process">
|
||||
<MetricCardTwo
|
||||
animationType="scale-rotate"
|
||||
textboxLayout="default"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "150+",
|
||||
description: "Proyectos finalizados",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "98%",
|
||||
description: "Clientes satisfechos",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "10+",
|
||||
description: "Años de experiencia",
|
||||
},
|
||||
]}
|
||||
title="Nuestro Impacto"
|
||||
description="Números que reflejan excelencia."
|
||||
/>
|
||||
</div>
|
||||
<div id="process" data-section="process">
|
||||
<MetricCardTwo
|
||||
animationType="scale-rotate"
|
||||
textboxLayout="default"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{ id: "m1", value: "150+", description: "Proyectos finalizados" },
|
||||
{ id: "m2", value: "98%", description: "Clientes satisfechos" },
|
||||
{ id: "m3", value: "10+", description: "Años de experiencia" }
|
||||
]}
|
||||
title="Nuestro Impacto"
|
||||
description="Números que reflejan excelencia."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "¿Tienen cobertura en toda la Riviera Maya?",
|
||||
content: "Sí, cubrimos desde Tulum hasta Puerto Morelos.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "¿Ofrecen garantías?",
|
||||
content: "Contamos con garantía de 1 año en materiales y mano de obra.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "¿Cómo inicio mi cotización?",
|
||||
content: "Puedes contactarnos vía formulario y agendamos una visita.",
|
||||
},
|
||||
]}
|
||||
sideTitle="Preguntas Frecuentes"
|
||||
faqsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{ id: "f1", title: "¿Tienen cobertura en toda la Riviera Maya?", content: "Sí, cubrimos desde Tulum hasta Puerto Morelos." },
|
||||
{ id: "f2", title: "¿Ofrecen garantías?", content: "Contamos con garantía de 1 año en materiales y mano de obra." },
|
||||
{ id: "f3", title: "¿Cómo inicio mi cotización?", content: "Puedes contactarnos vía formulario y agendamos una visita." }
|
||||
]}
|
||||
sideTitle="Preguntas Frecuentes"
|
||||
faqsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Hablemos de tu Proyecto"
|
||||
description="Envíanos tus datos y nos pondremos en contacto."
|
||||
inputs={[
|
||||
{
|
||||
name: "nombre",
|
||||
type: "text",
|
||||
placeholder: "Nombre completo",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Correo electrónico",
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
textarea={{
|
||||
name: "mensaje",
|
||||
placeholder: "Cuéntanos qué deseas remodelar",
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-bookshelf-water-dispenser-business-office-empty-desk-with-decorations-watercooler-startup-space-shelves-with-minimal-decor-decorative-plants-refreshment_482257-27791.jpg"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Hablemos de tu Proyecto"
|
||||
description="Envíanos tus datos y nos pondremos en contacto."
|
||||
inputs={[
|
||||
{ name: "nombre", type: "text", placeholder: "Nombre completo", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Correo electrónico", required: true }
|
||||
]}
|
||||
textarea={{ name: "mensaje", placeholder: "Cuéntanos qué deseas remodelar" }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-bookshelf-water-dispenser-business-office-empty-desk-with-decorations-watercooler-startup-space-shelves-with-minimal-decor-decorative-plants-refreshment_482257-27791.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="MayaRemodels"
|
||||
leftLink={{
|
||||
text: "Privacidad",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Términos",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="MayaRemodels"
|
||||
leftLink={{ text: "Privacidad", href: "#" }}
|
||||
rightLink={{ text: "Términos", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user