Files
05bad402-eb68-47a5-a97f-173…/src/app/page.tsx
2026-02-27 10:33:43 +00:00

170 lines
13 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import TextAbout from '@/components/sections/about/TextAbout';
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterBase from '@/components/sections/footer/FooterBase';
import { ArrowRight, CheckCircle, Home, Shield, Sparkles, Star } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="reveal-blur"
borderRadius="pill"
contentWidth="small"
sizing="mediumLarge"
background="grid"
cardStyle="gradient-radial"
primaryButtonStyle="shadow"
secondaryButtonStyle="radial-glow"
headingFontWeight="normal"
>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[{name: 'Hero', id: 'hero-section'}, {name: 'About', id: 'about-section'}, {name: 'Feature', id: 'features-section'}, {name: 'Product', id: 'product-section'}, {name: 'Testimonial', id: 'testimonial-section'}, {name: 'Contact', id: 'contact-section'}]}
button={{text: 'Schedule Tour', href: '#contact-section'}}
brandName='WarmReal Estate'
/>
</div>
<div id="hero-section" data-section="hero-section">
<HeroBillboard
title='Find Your Dream Home with Confidence'
description='Expert guidance and trusted service for every step of your real estate journey. Discover properties that match your lifestyle and vision.'
background={{ variant: 'radial-gradient' }}
tag='Trusted Since 2005'
tagIcon={Sparkles}
tagAnimation='slide-up'
buttons={[{text: 'Explore Properties', href: '#product-section'}, {text: 'Schedule Consultation', href: '#contact-section'}]}
buttonAnimation='slide-up'
avatars={[{src: 'http://img.b2bpic.net/free-photo/attractive-blonde-girl-tulle-skirt-having-fun-stairs-she-is-smiling-down_197531-617.jpg', alt: 'Happy client with realtor'}, {src: 'http://img.b2bpic.net/free-photo/cheerful-businesswoman-holding-folder_74855-4978.jpg', alt: 'Satisfied homebuyer'}]}
avatarText='1,200+ Happy Clients'
imageSrc='http://img.b2bpic.net/free-photo/happy-family-holding-hands-walking-yard_259150-59376.jpg'
imageAlt='Modern family home exterior'
mediaAnimation='slide-up'
marqueeItems={[{icon: CheckCircle, text: '100% Satisfaction Guarantee'}, {icon: Sparkles, text: 'Award-Winning Team'}, {icon: ArrowRight, text: 'Transparent Process'}]}
showMarqueeCard={true}
ariaLabel='Hero section showcasing real estate services'
/>
</div>
<div id="about-section" data-section="about-section">
<TextAbout
tag='ABOUT US'
tagIcon={Home}
tagAnimation='slide-up'
title='Your Trusted Partner in Finding the Perfect Home'
buttons={[{text: 'Explore Our Services', href: '#features-section'}, {text: 'Meet Our Team', href: '#testimonial-section'}]}
buttonAnimation='slide-up'
useInvertedBackground={true}
/>
</div>
<div id="features-section" data-section="features-section">
<FeatureCardTwentyThree
features={[
{id: 'feature-1', title: 'Comprehensive Market Analysis', tags: ['Data-Driven', 'Insightful'], imageSrc: 'http://img.b2bpic.net/free-photo/professional-female-leader-evaluating-trading-risks-before-making-investment_482257-112812.jpg', imageAlt: 'Market analysis dashboard showing property trends'},
{id: 'feature-2', title: 'Personalized Property Search', tags: ['Tailored', 'Efficient'], imageSrc: 'http://img.b2bpic.net/free-photo/smiling-real-estate-agent-talking-with-couple-interested-buying-new-home_637285-6081.jpg', imageAlt: 'User interface showcasing personalized property listings'},
{id: 'feature-3', title: 'Expert Negotiation Support', tags: ['Professional', 'Strategic'], imageSrc: 'http://img.b2bpic.net/free-photo/business-leaders-consulting-expert_74855-2095.jpg', imageAlt: 'Real estate agent negotiating a deal with clients'}
]}
animationType='slide-up'
title='Our Premium Real Estate Services'
description="We provide a full suite of services designed to make your real estate journey smooth, stress-free, and successful. From market insights to expert guidance, we're here to support you every step of the way."
textboxLayout='split-description'
useInvertedBackground={true}
tag='Trusted Excellence'
tagIcon={CheckCircle}
tagAnimation='blur-reveal'
buttons={[{text: 'Explore Services', href: '#product-section'}]}
buttonAnimation='opacity'
carouselMode='buttons'
/>
</div>
<div id="product-section" data-section="product-section">
<ProductCardThree
title='Our Premium Real Estate Services'
description='Comprehensive solutions tailored to meet your buying or selling needs with expert guidance every step of the way.'
tag='Featured'
tagIcon={Star}
tagAnimation='slide-up'
buttons={[{text: 'View All Services', href: '#features-section'}]}
buttonAnimation='opacity'
gridVariant='three-columns-all-equal-width'
animationType='slide-up'
textboxLayout='default'
useInvertedBackground={false}
products={[
{id: 'service-1', name: 'Home Buying Guide', price: '$49.99', imageSrc: 'http://img.b2bpic.net/free-photo/african-american-woman-her-bearded-caucasuan-husband-discuss-terms-new-contract-with-employee_273609-44247.jpg', imageAlt: 'Home Buying Guide illustration', isFavorited: false, initialQuantity: 1},
{id: 'service-2', name: "Seller's Marketplace", price: '$79.99', imageSrc: 'http://img.b2bpic.net/free-photo/house-loan-estate-sell-mortgage-concept_53876-125097.jpg', imageAlt: "Seller's Marketplace dashboard", isFavorited: false, initialQuantity: 1},
{id: 'service-3', name: 'Property Valuation Report', price: '$29.99', imageSrc: 'http://img.b2bpic.net/free-photo/interracial-couple-signing-mortgage-investment-contract-meeting-with-broker_1163-4633.jpg', imageAlt: 'Property valuation report sample', isFavorited: false, initialQuantity: 1}
]}
/>
</div>
<div id="testimonial-section" data-section="testimonial-section">
<TestimonialCardSix
testimonials={[
{id: 'testimonial-1', name: 'Sarah Johnson', handle: '@sarahj', testimonial: 'Working with this team was an absolute pleasure. They helped us find our dream home in just two weeks. Their expertise and dedication are unmatched.', imageSrc: 'http://img.b2bpic.net/free-photo/business-woman-analyzing-data-using-computer-while-spending-time-office-beautiful-young-grinning-professional-woman-office-graphs-charts_657921-370.jpg', imageAlt: 'Sarah Johnson, satisfied client', icon: Star},
{id: 'testimonial-2', name: 'Michael Chen', handle: '@michaelc', testimonial: 'As a first-time homebuyer, I was nervous about the process. The agents guided me through every step with patience and professionalism.', imageSrc: 'http://img.b2bpic.net/free-photo/positive-businessman-reading-document-couch_1262-3059.jpg', imageAlt: 'Michael Chen, first-time homebuyer', icon: Star},
{id: 'testimonial-3', name: 'Emily Rodriguez', handle: '@emilyr', testimonial: 'The selling process was seamless and stress-free. They priced our home perfectly and found buyers within our timeline.', imageSrc: 'http://img.b2bpic.net/free-photo/happy-african-american-young-family-bought-new-house_7861-3097.jpg', imageAlt: 'Emily Rodriguez, seller client', icon: Star},
{id: 'testimonial-4', name: 'Sarah Johnson', handle: '@sarahj', testimonial: 'Working with this team was an absolute pleasure. They helped us find our dream home in just two weeks. Their expertise and dedication are unmatched.', imageSrc: 'http://img.b2bpic.net/free-photo/business-woman-analyzing-data-using-computer-while-spending-time-office-beautiful-young-grinning-professional-woman-office-graphs-charts_657921-370.jpg', imageAlt: 'Sarah Johnson, satisfied client', icon: Star},
{id: 'testimonial-5', name: 'Michael Chen', handle: '@michaelc', testimonial: 'As a first-time homebuyer, I was nervous about the process. The agents guided me through every step with patience and professionalism.', imageSrc: 'http://img.b2bpic.net/free-photo/positive-businessman-reading-document-couch_1262-3059.jpg', imageAlt: 'Michael Chen, first-time homebuyer', icon: Star},
{id: 'testimonial-6', name: 'Emily Rodriguez', handle: '@emilyr', testimonial: 'The selling process was seamless and stress-free. They priced our home perfectly and found buyers within our timeline.', imageSrc: 'http://img.b2bpic.net/free-photo/happy-african-american-young-family-bought-new-house_7861-3097.jpg', imageAlt: 'Emily Rodriguez, seller client', icon: Star}
]}
animationType='slide-up'
title='What Our Clients Say'
description='Hear from homeowners who have trusted us with their real estate journey. Our commitment to excellence has earned us countless positive reviews and repeat clients.'
textboxLayout='inline-image'
useInvertedBackground={true}
tag='Trusted by Thousands'
tagIcon={Shield}
tagAnimation='blur-reveal'
buttons={[{text: 'View All Reviews', href: '#'}]}
buttonAnimation='opacity'
speed={40}
topMarqueeDirection='left'
ariaLabel='Testimonials section featuring client reviews'
/>
</div>
<div id="contact-section" data-section="contact-section">
<ContactSplitForm
title='Get In Touch With Our Expert Team'
description='Ready to find your dream home or sell your property? Our trusted real estate professionals are here to guide you every step of the way.'
inputs={[{name: 'name', type: 'text', placeholder: 'Your Full Name', required: true}, {name: 'email', type: 'email', placeholder: 'Your Email Address', required: true}, {name: 'phone', type: 'tel', placeholder: 'Your Phone Number'}]}
textarea={{name: 'message', placeholder: 'Tell us about your property needs...', rows: 4, required: true}}
useInvertedBackground={false}
imageSrc='http://img.b2bpic.net/free-photo/empty-home-office-belonging-small-business-owner-with-data-sales-reports_482257-90829.jpg'
imageAlt='Real estate agent assisting a client'
mediaAnimation='slide-up'
mediaPosition='right'
buttonText='Send Message'
ariaLabel='Contact section'
className='py-16'
containerClassName='max-w-7xl mx-auto px-4 sm:px-6 lg:px-8'
contentClassName='grid grid-cols-1 lg:grid-cols-2 gap-12 items-center'
formCardClassName='bg-white rounded-xl shadow-lg p-8'
titleClassName='text-3xl font-bold text-gray-900 mb-4'
descriptionClassName='text-lg text-gray-600 mb-6'
buttonClassName='bg-amber-600 hover:bg-amber-700 text-white font-semibold py-3 px-6 rounded-lg transition duration-300 ease-in-out transform hover:scale-105'
buttonTextClassName='text-base'
mediaWrapperClassName='relative overflow-hidden rounded-xl'
mediaClassName='w-full h-full object-cover'
/>
</div>
<div id="footer-section" data-section="footer-section">
<FooterBase
columns={[
{title: 'Explore', items: [{label: 'Home', href: '#hero-section'}, {label: 'Properties', href: '#product-section'}, {label: 'Services', href: '#features-section'}, {label: 'About Us', href: '#about-section'}]},
{title: 'Support', items: [{label: 'Contact Us', href: '#contact-section'}, {label: 'FAQs', href: '#testimonial-section'}, {label: 'Privacy Policy', href: '#'}, {label: 'Terms of Service', href: '#'}]},
{title: 'Connect', items: [{label: 'Facebook', href: '#'}, {label: 'Instagram', href: '#'}, {label: 'Twitter', href: '#'}, {label: 'LinkedIn', href: '#'}]}
]}
logoText='Haven Real Estate'
copyrightText='© 2025 Haven Real Estate. All rights reserved.'
ariaLabel='Site footer'
/>
</div>
</ThemeProvider>
);
}