Update src/app/page.tsx
This commit is contained in:
328
src/app/page.tsx
328
src/app/page.tsx
@@ -25,246 +25,106 @@ export default function LandingPage() {
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="SecureFence"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Services", id: "features" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="SecureFence"
|
||||
button={{ text: "Get a Quote", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDoubleCarousel
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
title="Secure Your Property with Quality Fencing"
|
||||
description="Expert fence installation, repair, and design for homeowners who value security, beauty, and privacy. Built to last."
|
||||
leftCarouselItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/japanese-house-entrance-with-nature_23-2149301042.jpg?_wi=1",
|
||||
imageAlt: "Modern cedar privacy fence",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/wooden-fence-garden-full-trees_181624-27357.jpg?_wi=1",
|
||||
imageAlt: "Professional wood fence installation",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medieval-door-from-peles-castle-romania_482257-34190.jpg?_wi=1",
|
||||
imageAlt: "Custom metal garden gate",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-base-green-barrier-overpass-bridge_181624-22816.jpg?_wi=1",
|
||||
imageAlt: "Durable white vinyl perimeter",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/japanese-house-entrance-with-nature_23-2149301042.jpg?_wi=2",
|
||||
imageAlt: "Backyard wood fence design",
|
||||
},
|
||||
]}
|
||||
rightCarouselItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medieval-door-from-peles-castle-romania_482257-34190.jpg?_wi=2",
|
||||
imageAlt: "Ornamental iron security",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-base-green-barrier-overpass-bridge_181624-22816.jpg?_wi=2",
|
||||
imageAlt: "Low-maintenance vinyl panels",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/japanese-house-entrance-with-nature_23-2149301042.jpg?_wi=3",
|
||||
imageAlt: "Residential wood fence design",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/wooden-fence-garden-full-trees_181624-27357.jpg?_wi=2",
|
||||
imageAlt: "Custom garden fence build",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medieval-door-from-peles-castle-romania_482257-34190.jpg?_wi=3",
|
||||
imageAlt: "Wrought iron gate detailing",
|
||||
},
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Get a Free Quote",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitDoubleCarousel
|
||||
background={{ variant: "plain" }}
|
||||
title="Secure Your Property with Quality Fencing"
|
||||
description="Expert fence installation, repair, and design for homeowners who value security, beauty, and privacy. Built to last."
|
||||
leftCarouselItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/japanese-house-entrance-with-nature_23-2149301042.jpg", imageAlt: "Modern cedar privacy fence" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/wooden-fence-garden-full-trees_181624-27357.jpg", imageAlt: "Professional wood fence installation" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/medieval-door-from-peles-castle-romania_482257-34190.jpg", imageAlt: "Custom metal garden gate" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/closeup-base-green-barrier-overpass-bridge_181624-22816.jpg", imageAlt: "Durable white vinyl perimeter" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/japanese-house-entrance-with-nature_23-2149301042.jpg", imageAlt: "Backyard wood fence design" },
|
||||
]}
|
||||
rightCarouselItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/medieval-door-from-peles-castle-romania_482257-34190.jpg", imageAlt: "Ornamental iron security" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/closeup-base-green-barrier-overpass-bridge_181624-22816.jpg", imageAlt: "Low-maintenance vinyl panels" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/japanese-house-entrance-with-nature_23-2149301042.jpg", imageAlt: "Residential wood fence design" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/wooden-fence-garden-full-trees_181624-27357.jpg", imageAlt: "Custom garden fence build" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/medieval-door-from-peles-castle-romania_482257-34190.jpg", imageAlt: "Wrought iron gate detailing" },
|
||||
]}
|
||||
buttons={[{ text: "Get a Free Quote", href: "#contact" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyOne
|
||||
useInvertedBackground={true}
|
||||
title="Our Professional Services"
|
||||
description="We specialize in a variety of fencing materials and styles tailored to meet your property requirements."
|
||||
accordionItems={[
|
||||
{
|
||||
id: "1",
|
||||
title: "Wood Privacy Fencing",
|
||||
content: "Durable, high-quality timber structures built for maximum privacy and classic aesthetics.",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Metal Ornamental Fencing",
|
||||
content: "Sophisticated security solutions with ornate details, combining strength with elegance.",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Vinyl Low-Maintenance",
|
||||
content: "Modern, weather-resistant solutions designed to keep your yard looking great for years.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/wooden-fence-garden-full-trees_181624-27357.jpg?_wi=3"
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardTwentyOne
|
||||
useInvertedBackground={true}
|
||||
title="Our Professional Services"
|
||||
description="We specialize in a variety of fencing materials and styles tailored to meet your property requirements."
|
||||
accordionItems={[
|
||||
{ id: "1", title: "Wood Privacy Fencing", content: "Durable, high-quality timber structures built for maximum privacy and classic aesthetics." },
|
||||
{ id: "2", title: "Metal Ornamental Fencing", content: "Sophisticated security solutions with ornate details, combining strength with elegance." },
|
||||
{ id: "3", title: "Vinyl Low-Maintenance", content: "Modern, weather-resistant solutions designed to keep your yard looking great for years." },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/wooden-fence-garden-full-trees_181624-27357.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTen
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
title: "Professional and fast",
|
||||
quote: "SecureFence did an incredible job on our backyard wood fence. Professional and very thorough.",
|
||||
name: "Sarah Miller",
|
||||
role: "Homeowner",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/lifestyle-people-office_23-2149173710.jpg?_wi=1",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Best in town",
|
||||
quote: "High quality materials and friendly installation team. My new metal fence is beautiful.",
|
||||
name: "David Thompson",
|
||||
role: "Property Owner",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/carpenter-working-house_329181-9436.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Highly recommended",
|
||||
quote: "Excellent communication from start to finish. Our vinyl fence looks amazing.",
|
||||
name: "Elena Rodriguez",
|
||||
role: "Homeowner",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/attractive-blonde-girl-tulle-skirt-having-fun-stairs-she-is-smiling-down_197531-617.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
title: "Very impressed",
|
||||
quote: "The team was prompt and finished the job exactly when they said they would. Top notch!",
|
||||
name: "James Wilson",
|
||||
role: "Property Owner",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-man-stairs_181624-41082.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
title: "Excellent Craftsmanship",
|
||||
quote: "Could not be happier with the results. The fence has completely transformed our curb appeal.",
|
||||
name: "Marcus L.",
|
||||
role: "Homeowner",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/lifestyle-people-office_23-2149173710.jpg?_wi=2",
|
||||
},
|
||||
]}
|
||||
title="What Homeowners Say"
|
||||
description="We take pride in our work. Here is why our clients trust SecureFence with their homes."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTen
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", title: "Professional and fast", quote: "SecureFence did an incredible job on our backyard wood fence.", name: "Sarah Miller", role: "Homeowner", imageSrc: "http://img.b2bpic.net/free-photo/lifestyle-people-office_23-2149173710.jpg" },
|
||||
{ id: "2", title: "Best in town", quote: "High quality materials and friendly installation team.", name: "David Thompson", role: "Property Owner", imageSrc: "http://img.b2bpic.net/free-photo/carpenter-working-house_329181-9436.jpg" },
|
||||
{ id: "3", title: "Highly recommended", quote: "Excellent communication from start to finish.", name: "Elena Rodriguez", role: "Homeowner", imageSrc: "http://img.b2bpic.net/free-photo/attractive-blonde-girl-tulle-skirt-having-fun-stairs-she-is-smiling-down_197531-617.jpg" },
|
||||
{ id: "4", title: "Very impressed", quote: "The team was prompt and finished the job exactly when they said they would.", name: "James Wilson", role: "Property Owner", imageSrc: "http://img.b2bpic.net/free-photo/young-man-stairs_181624-41082.jpg" },
|
||||
{ id: "5", title: "Excellent Craftsmanship", quote: "Could not be happier with the results.", name: "Marcus L.", role: "Homeowner", imageSrc: "http://img.b2bpic.net/free-photo/lifestyle-people-office_23-2149173710.jpg" },
|
||||
]}
|
||||
title="What Homeowners Say"
|
||||
description="We take pride in our work. Here is why our clients trust SecureFence."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "How long does installation take?",
|
||||
content: "Most residential projects are completed within 2-4 days, depending on scope.",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Do you handle permits?",
|
||||
content: "Yes, we handle all necessary permit filings for your local jurisdiction.",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Do you offer warranties?",
|
||||
content: "We offer a 5-year workmanship guarantee on all new fence installations.",
|
||||
},
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Clear answers to common questions about your new fence installation."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{ id: "1", title: "How long does installation take?", content: "Most residential projects are completed within 2-4 days." },
|
||||
{ id: "2", title: "Do you handle permits?", content: "Yes, we handle all necessary permit filings." },
|
||||
{ id: "3", title: "Do you offer warranties?", content: "We offer a 5-year workmanship guarantee." },
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Clear answers to common questions about your new fence installation."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
text="Ready to secure your property? Reach out for a free, no-obligation consultation."
|
||||
buttons={[
|
||||
{
|
||||
text: "Call (555) 123-4567",
|
||||
href: "tel:5551234567",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
text="Ready to secure your property? Reach out for a free, no-obligation consultation."
|
||||
buttons={[{ text: "Call (555) 123-4567", href: "tel:5551234567" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Services",
|
||||
href: "#features",
|
||||
},
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="SecureFence"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{ items: [{ label: "Services", href: "#features" }, { label: "About Us", href: "#" }, { label: "Contact", href: "#contact" }] },
|
||||
{ items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] },
|
||||
]}
|
||||
logoText="SecureFence"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user