Update src/app/page.tsx
This commit is contained in:
408
src/app/page.tsx
408
src/app/page.tsx
@@ -19,295 +19,145 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="text-stagger"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Listings",
|
||||
id: "listings",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Urban Haven"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Listings", id: "listings" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Urban Haven"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboardSplit
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
logoText="Urban Haven Realty"
|
||||
description="Find your dream home with the premier real estate agency. We bring expert local knowledge and personalized service to every transaction."
|
||||
buttons={[
|
||||
{
|
||||
text: "Explore Listings",
|
||||
href: "#listings",
|
||||
},
|
||||
{
|
||||
text: "Contact Us",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
layoutOrder="default"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/female-car-dealer-giving-keys-young-couple_23-2148384953.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
imageAlt="Luxury residential architecture"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboardSplit
|
||||
logoText="Urban Haven Realty"
|
||||
description="Find your dream home with the premier real estate agency. We bring expert local knowledge and personalized service to every transaction."
|
||||
background={{ variant: "plain" }}
|
||||
buttons={[{ text: "Explore Listings", href: "#listings" }, { text: "Contact Us", href: "#contact" }]}
|
||||
layoutOrder="default"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/female-car-dealer-giving-keys-young-couple_23-2148384953.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={true}
|
||||
tag="Our Expertise"
|
||||
title="Your Trusted Partner in Real Estate"
|
||||
description="With over 20 years of experience, Urban Haven helps buyers and sellers navigate the complex property market with confidence."
|
||||
subdescription="We specialize in luxury residences, urban condos, and investment properties across the city, providing a seamless buying experience."
|
||||
icon={Shield}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/happy-african-american-businesswoman-talking-female-colleagues-while-working-office_637285-9843.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
imageAlt="Professional real estate agency team"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
tag="Our Expertise"
|
||||
title="Your Trusted Partner in Real Estate"
|
||||
description="With over 20 years of experience, Urban Haven helps buyers and sellers navigate the complex property market with confidence."
|
||||
subdescription="We specialize in luxury residences, urban condos, and investment properties across the city, providing a seamless buying experience."
|
||||
icon={Shield}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/happy-african-american-businesswoman-talking-female-colleagues-while-working-office_637285-9843.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
useInvertedBackground={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="listings" data-section="listings">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
brand: "Luxury",
|
||||
name: "Modern Urban Condo",
|
||||
price: "$850,000",
|
||||
rating: 5,
|
||||
reviewCount: "12",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/dining-set-modern-luxury-dining-room_105762-1797.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
brand: "Family",
|
||||
name: "Suburban Estate",
|
||||
price: "$1,250,000",
|
||||
rating: 5,
|
||||
reviewCount: "8",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/terrace-exterior-building_1203-3258.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
brand: "Investment",
|
||||
name: "Penthouse Suite",
|
||||
price: "$2,100,000",
|
||||
rating: 5,
|
||||
reviewCount: "5",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/empty-table-chair-restaurant_1339-3323.jpg",
|
||||
},
|
||||
]}
|
||||
title="Featured Properties"
|
||||
description="Discover our hand-picked collection of premium real estate opportunities currently available on the market."
|
||||
/>
|
||||
</div>
|
||||
<div id="listings" data-section="listings">
|
||||
<ProductCardTwo
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
title="Featured Properties"
|
||||
description="Discover our hand-picked collection of premium real estate opportunities currently available on the market."
|
||||
products={[
|
||||
{ id: "1", brand: "Luxury", name: "Modern Urban Condo", price: "$850,000", rating: 5, reviewCount: "12", imageSrc: "http://img.b2bpic.net/free-photo/dining-set-modern-luxury-dining-room_105762-1797.jpg" },
|
||||
{ id: "2", brand: "Family", name: "Suburban Estate", price: "$1,250,000", rating: 5, reviewCount: "8", imageSrc: "http://img.b2bpic.net/free-photo/terrace-exterior-building_1203-3258.jpg" },
|
||||
{ id: "3", brand: "Investment", name: "Penthouse Suite", price: "$2,100,000", rating: 5, reviewCount: "5", imageSrc: "http://img.b2bpic.net/free-photo/empty-table-chair-restaurant_1339-3323.jpg" },
|
||||
]}
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardFourteen
|
||||
useInvertedBackground={true}
|
||||
title="Agency Milestones"
|
||||
tag="Impact"
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "500+",
|
||||
description: "Successful Closings",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "$250M",
|
||||
description: "Property Volume Sold",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "15+",
|
||||
description: "Years of Excellence",
|
||||
},
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardFourteen
|
||||
title="Agency Milestones"
|
||||
tag="Impact"
|
||||
metrics={[
|
||||
{ id: "m1", value: "500+", description: "Successful Closings" },
|
||||
{ id: "m2", value: "$250M", description: "Property Volume Sold" },
|
||||
{ id: "m3", value: "15+", description: "Years of Excellence" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
useInvertedBackground={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSixteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah Jenkins",
|
||||
role: "Home Buyer",
|
||||
company: "Tech Executive",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-man-making-plans-renovate-house-together_23-2148814563.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Mark Wilson",
|
||||
role: "Investor",
|
||||
company: "Local Business",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-female-realtor-showing-new-house-plan-couple_23-2148895495.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Emily Chen",
|
||||
role: "First-time Buyer",
|
||||
company: "Designer",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/female-realtor-giving-keys-elderly-couple-smiling-family-glasses-standing-saleswoman-pink-suit-real-estate-purchase-concept_74855-22277.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David Thorne",
|
||||
role: "Property Owner",
|
||||
company: "Architect",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/insurance-mortgage-real-estate-concept-surprised-man-pointing-house-model-smiling-searchi_1258-154378.jpg",
|
||||
},
|
||||
]}
|
||||
kpiItems={[
|
||||
{
|
||||
value: "98%",
|
||||
label: "Client Satisfaction",
|
||||
},
|
||||
{
|
||||
value: "12 Days",
|
||||
label: "Average Listing Time",
|
||||
},
|
||||
{
|
||||
value: "4.9/5",
|
||||
label: "Average Google Rating",
|
||||
},
|
||||
]}
|
||||
title="Client Success Stories"
|
||||
description="Hear from our happy clients about their experiences finding and securing their dream homes."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSixteen
|
||||
title="Client Success Stories"
|
||||
description="Hear from our happy clients about their experiences finding and securing their dream homes."
|
||||
testimonials={[
|
||||
{ id: "1", name: "Sarah Jenkins", role: "Home Buyer", company: "Tech Executive", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-man-making-plans-renovate-house-together_23-2148814563.jpg" },
|
||||
{ id: "2", name: "Mark Wilson", role: "Investor", company: "Local Business", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/front-view-female-realtor-showing-new-house-plan-couple_23-2148895495.jpg" },
|
||||
{ id: "3", name: "Emily Chen", role: "First-time Buyer", company: "Designer", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/female-realtor-giving-keys-elderly-couple-smiling-family-glasses-standing-saleswoman-pink-suit-real-estate-purchase-concept_74855-22277.jpg" },
|
||||
{ id: "4", name: "David Thorne", role: "Property Owner", company: "Architect", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/insurance-mortgage-real-estate-concept-surprised-man-pointing-house-model-smiling-searchi_1258-154378.jpg" },
|
||||
]}
|
||||
kpiItems={[
|
||||
{ value: "98%", label: "Client Satisfaction" },
|
||||
{ value: "12 Days", label: "Average Listing Time" },
|
||||
{ value: "4.9/5", label: "Average Google Rating" },
|
||||
]}
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "How do you determine listing prices?",
|
||||
content: "We conduct a comprehensive comparative market analysis using the latest local data.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Do you offer property management?",
|
||||
content: "Yes, we provide full-service property management for our investment clients.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "What areas do you serve?",
|
||||
content: "We cover the entire metropolitan area and surrounding luxury suburbs.",
|
||||
},
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Everything you need to know about working with Urban Haven Realty."
|
||||
faqsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
title="Frequently Asked Questions"
|
||||
description="Everything you need to know about working with Urban Haven Realty."
|
||||
faqs={[
|
||||
{ id: "f1", title: "How do you determine listing prices?", content: "We conduct a comprehensive comparative market analysis using the latest local data." },
|
||||
{ id: "f2", title: "Do you offer property management?", content: "Yes, we provide full-service property management for our investment clients." },
|
||||
{ id: "f3", title: "What areas do you serve?", content: "We cover the entire metropolitan area and surrounding luxury suburbs." },
|
||||
]}
|
||||
faqsAnimation="blur-reveal"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactFaq
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "c1",
|
||||
title: "How quickly can we view a property?",
|
||||
content: "We can usually arrange viewings within 24-48 hours.",
|
||||
},
|
||||
{
|
||||
id: "c2",
|
||||
title: "Are virtual tours available?",
|
||||
content: "Yes, all our exclusive listings feature 3D virtual walkthroughs.",
|
||||
},
|
||||
]}
|
||||
ctaTitle="Ready to Start Your Search?"
|
||||
ctaDescription="Get in touch with our agents today for a free initial consultation."
|
||||
ctaButton={{
|
||||
text: "Schedule Consultation",
|
||||
href: "#",
|
||||
}}
|
||||
ctaIcon={Phone}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactFaq
|
||||
ctaTitle="Ready to Start Your Search?"
|
||||
ctaDescription="Get in touch with our agents today for a free initial consultation."
|
||||
ctaButton={{ text: "Schedule Consultation", href: "#" }}
|
||||
ctaIcon={Phone}
|
||||
faqs={[
|
||||
{ id: "c1", title: "How quickly can we view a property?", content: "We can usually arrange viewings within 24-48 hours." },
|
||||
{ id: "c2", title: "Are virtual tours available?", content: "Yes, all our exclusive listings feature 3D virtual walkthroughs." },
|
||||
]}
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Urban Haven"
|
||||
columns={[
|
||||
{
|
||||
title: "Agency",
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Careers",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Properties",
|
||||
items: [
|
||||
{
|
||||
label: "For Sale",
|
||||
href: "#listings",
|
||||
},
|
||||
{
|
||||
label: "Rentals",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#faq",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2025 Urban Haven Realty. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Urban Haven"
|
||||
columns={[
|
||||
{ title: "Agency", items: [{ label: "About Us", href: "#about" }, { label: "Careers", href: "#" }] },
|
||||
{ title: "Properties", items: [{ label: "For Sale", href: "#listings" }, { label: "Rentals", href: "#" }] },
|
||||
{ title: "Support", items: [{ label: "Contact", href: "#contact" }, { label: "FAQ", href: "#faq" }] },
|
||||
]}
|
||||
copyrightText="© 2025 Urban Haven Realty. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user