Merge version_1 into main #1
269
src/app/page.tsx
269
src/app/page.tsx
@@ -19,27 +19,26 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="directional-hover"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="soft"
|
||||
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: "Home", id: "hero"},
|
||||
{
|
||||
name: "Services",
|
||||
id: "products",
|
||||
},
|
||||
name: "Services", id: "products"},
|
||||
{
|
||||
name: "Testimonials",
|
||||
id: "testimonials",
|
||||
},
|
||||
name: "Testimonials", id: "testimonials"},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
name: "Contact", id: "contact"},
|
||||
]}
|
||||
brandName="Miami Fence Co."
|
||||
/>
|
||||
@@ -48,78 +47,49 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitKpi
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
variant: "plain"}}
|
||||
title="Professional Fence Installation in Miami"
|
||||
description="Transform your outdoor space with durable, high-quality fencing solutions tailored to your Miami home. Expert craftsmanship, premium materials, and reliable service."
|
||||
kpis={[
|
||||
{
|
||||
value: "15+",
|
||||
label: "Years Experience",
|
||||
},
|
||||
value: "15+", label: "Years Experience"},
|
||||
{
|
||||
value: "1,200+",
|
||||
label: "Projects Completed",
|
||||
},
|
||||
value: "1,200+", label: "Projects Completed"},
|
||||
{
|
||||
value: "5/5",
|
||||
label: "Client Rating",
|
||||
},
|
||||
value: "5/5", label: "Client Rating"},
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
buttons={[
|
||||
{
|
||||
text: "Get a Free Quote",
|
||||
href: "#contact",
|
||||
},
|
||||
text: "Get a Free Quote", href: "#contact"},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/young-woman-using-app-sea-street_1163-3396.jpg"
|
||||
imageAlt="Professional fence installation in Miami"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/beach-wooden-awnings-empty-sandy-beach-selective-focus-vacation-seaside-resort_166373-2367.jpg",
|
||||
alt: "Beach wooden awnings on an empty sandy beach",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/beach-wooden-awnings-empty-sandy-beach-selective-focus-vacation-seaside-resort_166373-2367.jpg", alt: "Beach wooden awnings on an empty sandy beach"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-blonde-girl-black-skirt-pink-coat-posed-against-vintage-railing-with-column-old-house_627829-8654.jpg",
|
||||
alt: "Young blonde girl in black skirt and pink coat",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/young-blonde-girl-black-skirt-pink-coat-posed-against-vintage-railing-with-column-old-house_627829-8654.jpg", alt: "Young blonde girl in black skirt and pink coat"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/type-luxurious-summer-villa-hotel-amara-dolce-vita-luxury-hotel-beautiful-architecture-tekirova-kemer-turkey_146671-18715.jpg",
|
||||
alt: "Luxurious summer villa hotel architecture",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/type-luxurious-summer-villa-hotel-amara-dolce-vita-luxury-hotel-beautiful-architecture-tekirova-kemer-turkey_146671-18715.jpg", alt: "Luxurious summer villa hotel architecture"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-girl-pajamas-with-pillow-relaxes-garden_72229-600.jpg",
|
||||
alt: "Girl in pajamas with a pillow in the garden",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/young-girl-pajamas-with-pillow-relaxes-garden_72229-600.jpg", alt: "Girl in pajamas with a pillow in the garden"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/sparrow-perched-white-wooden-fence-with-blurry-lake_181624-23244.jpg",
|
||||
alt: "Sparrow perched on white wooden fence",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/sparrow-perched-white-wooden-fence-with-blurry-lake_181624-23244.jpg", alt: "Sparrow perched on white wooden fence"},
|
||||
]}
|
||||
avatarText="Trusted by 1,000+ happy Miami homeowners"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Licensed & Insured",
|
||||
},
|
||||
type: "text", text: "Licensed & Insured"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Free Estimates",
|
||||
},
|
||||
type: "text", text: "Free Estimates"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Quality Guaranteed",
|
||||
},
|
||||
type: "text", text: "Quality Guaranteed"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Fast Installation",
|
||||
},
|
||||
type: "text", text: "Fast Installation"},
|
||||
{
|
||||
type: "text",
|
||||
text: "Local Experts",
|
||||
},
|
||||
type: "text", text: "Local Experts"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -130,9 +100,7 @@ export default function LandingPage() {
|
||||
title="Crafting Quality Fences for Miami Homes Since 2010"
|
||||
buttons={[
|
||||
{
|
||||
text: "Our Process",
|
||||
href: "#products",
|
||||
},
|
||||
text: "Our Process", href: "#products"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -145,41 +113,17 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Aluminum Fencing",
|
||||
price: "Custom Pricing",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/male-sportsman-warming-up-before-training_23-2148203565.jpg",
|
||||
},
|
||||
id: "p1", name: "Aluminum Fencing", price: "Custom Pricing", imageSrc: "http://img.b2bpic.net/free-photo/male-sportsman-warming-up-before-training_23-2148203565.jpg"},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Classic Wood Fences",
|
||||
price: "Custom Pricing",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/wooden-fence-texture_1137-222.jpg",
|
||||
},
|
||||
id: "p2", name: "Classic Wood Fences", price: "Custom Pricing", imageSrc: "http://img.b2bpic.net/free-photo/wooden-fence-texture_1137-222.jpg"},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Durable Vinyl Fencing",
|
||||
price: "Custom Pricing",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/big-fence-urban-park_53876-32203.jpg",
|
||||
},
|
||||
id: "p3", name: "Durable Vinyl Fencing", price: "Custom Pricing", imageSrc: "http://img.b2bpic.net/free-photo/big-fence-urban-park_53876-32203.jpg"},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Commercial Chain Link",
|
||||
price: "Custom Pricing",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-seamless-pattern-windows_181624-346.jpg",
|
||||
},
|
||||
id: "p4", name: "Commercial Chain Link", price: "Custom Pricing", imageSrc: "http://img.b2bpic.net/free-photo/abstract-seamless-pattern-windows_181624-346.jpg"},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Ornamental Iron Fences",
|
||||
price: "Custom Pricing",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/entrance-old-luxury-mansion-bucharest-romania-golden-details-facade-fence_1268-19825.jpg",
|
||||
},
|
||||
id: "p5", name: "Ornamental Iron Fences", price: "Custom Pricing", imageSrc: "http://img.b2bpic.net/free-photo/entrance-old-luxury-mansion-bucharest-romania-golden-details-facade-fence_1268-19825.jpg"},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Privacy Solutions",
|
||||
price: "Custom Pricing",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/still-life-bicycle-basket_23-2149682001.jpg",
|
||||
},
|
||||
id: "p6", name: "Privacy Solutions", price: "Custom Pricing", imageSrc: "http://img.b2bpic.net/free-photo/still-life-bicycle-basket_23-2149682001.jpg"},
|
||||
]}
|
||||
title="Premium Fence Selections"
|
||||
description="Explore our diverse range of fencing materials designed to withstand the Miami climate."
|
||||
@@ -193,34 +137,16 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "100%",
|
||||
title: "Customer Satisfaction",
|
||||
items: [
|
||||
"Fully Licensed",
|
||||
"Insured Crew",
|
||||
"Local Expert Team",
|
||||
],
|
||||
id: "m1", value: "100%", title: "Customer Satisfaction", items: [
|
||||
"Fully Licensed", "Insured Crew", "Local Expert Team"],
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "24h",
|
||||
title: "Response Time",
|
||||
items: [
|
||||
"Free Consultations",
|
||||
"Quick Estimates",
|
||||
"Direct Communication",
|
||||
],
|
||||
id: "m2", value: "24h", title: "Response Time", items: [
|
||||
"Free Consultations", "Quick Estimates", "Direct Communication"],
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "Lifetime",
|
||||
title: "Workmanship Guarantee",
|
||||
items: [
|
||||
"Secure Installation",
|
||||
"Quality Materials",
|
||||
"Enduring Design",
|
||||
],
|
||||
id: "m3", value: "Lifetime", title: "Workmanship Guarantee", items: [
|
||||
"Secure Installation", "Quality Materials", "Enduring Design"],
|
||||
},
|
||||
]}
|
||||
title="Why Miami Homeowners Choose Us"
|
||||
@@ -236,45 +162,20 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Alex Rivera",
|
||||
role: "Homeowner",
|
||||
company: "Miami Gardens",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/people-meeting-discussing-neighbourhood_23-2149447149.jpg",
|
||||
},
|
||||
id: "t1", name: "Alex Rivera", role: "Homeowner", company: "Miami Gardens", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/people-meeting-discussing-neighbourhood_23-2149447149.jpg"},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Sarah Miller",
|
||||
role: "Homeowner",
|
||||
company: "Coral Gables",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-carring-bunny_23-2148568698.jpg",
|
||||
},
|
||||
id: "t2", name: "Sarah Miller", role: "Homeowner", company: "Coral Gables", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-carring-bunny_23-2148568698.jpg"},
|
||||
{
|
||||
id: "t3",
|
||||
name: "David Thompson",
|
||||
role: "Homeowner",
|
||||
company: "Brickell",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/person-playing-sudoku-game-alone_23-2149073717.jpg",
|
||||
},
|
||||
id: "t3", name: "David Thompson", role: "Homeowner", company: "Brickell", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/person-playing-sudoku-game-alone_23-2149073717.jpg"},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Elena Rodriguez",
|
||||
role: "Homeowner",
|
||||
company: "Pinecrest",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-home-with-heater_23-2149339547.jpg",
|
||||
},
|
||||
id: "t4", name: "Elena Rodriguez", role: "Homeowner", company: "Pinecrest", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-home-with-heater_23-2149339547.jpg"},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Mark Johnson",
|
||||
role: "Homeowner",
|
||||
company: "Coconut Grove",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-woman-taking-selfie_23-2148020565.jpg",
|
||||
},
|
||||
id: "t5", name: "Mark Johnson", role: "Homeowner", company: "Coconut Grove", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-woman-taking-selfie_23-2148020565.jpg"},
|
||||
]}
|
||||
title="What Our Clients Say"
|
||||
description="Trusted by hundreds of families across Miami for beautiful, secure fencing."
|
||||
@@ -286,14 +187,7 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"Home Improvement Association",
|
||||
"Miami Chamber of Commerce",
|
||||
"National Fence Association",
|
||||
"BBB Accreditation",
|
||||
"Miami Quality Standards",
|
||||
"Construction Excellence",
|
||||
"Professional Standards Board",
|
||||
]}
|
||||
"Home Improvement Association", "Miami Chamber of Commerce", "National Fence Association", "BBB Accreditation", "Miami Quality Standards", "Construction Excellence", "Professional Standards Board"]}
|
||||
title="Proudly Accredited & Recognized"
|
||||
description="Setting the standard for quality fencing in South Florida."
|
||||
/>
|
||||
@@ -304,20 +198,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Do I need a permit for my fence in Miami?",
|
||||
content: "Yes, most residential fence projects in Miami require a permit. We handle the entire permitting process for you to ensure compliance with local regulations.",
|
||||
},
|
||||
id: "f1", title: "Do I need a permit for my fence in Miami?", content: "Yes, most residential fence projects in Miami require a permit. We handle the entire permitting process for you to ensure compliance with local regulations."},
|
||||
{
|
||||
id: "f2",
|
||||
title: "How long does installation usually take?",
|
||||
content: "Most standard residential installations take 2-4 days, depending on the property size, fence material, and weather conditions.",
|
||||
},
|
||||
id: "f2", title: "How long does installation usually take?", content: "Most standard residential installations take 2-4 days, depending on the property size, fence material, and weather conditions."},
|
||||
{
|
||||
id: "f3",
|
||||
title: "What kind of fencing lasts longest in Miami's humid weather?",
|
||||
content: "Aluminum, vinyl, and high-quality treated wood are excellent choices for the Miami climate. We help you choose based on your specific location and aesthetic preferences.",
|
||||
},
|
||||
id: "f3", title: "What kind of fencing lasts longest in Miami's humid weather?", content: "Aluminum, vinyl, and high-quality treated wood are excellent choices for the Miami climate. We help you choose based on your specific location and aesthetic preferences."},
|
||||
]}
|
||||
sideTitle="Frequently Asked Questions"
|
||||
faqsAnimation="slide-up"
|
||||
@@ -328,16 +213,13 @@ export default function LandingPage() {
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
variant: "sparkles-gradient"}}
|
||||
tag="Get Started"
|
||||
title="Ready to Secure Your Miami Home?"
|
||||
description="Request your free consultation and quote today. Let our experts provide the perfect fence solution for your property."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Us Now",
|
||||
href: "#",
|
||||
},
|
||||
text: "Contact Us Now", href: "#"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -347,50 +229,31 @@ export default function LandingPage() {
|
||||
logoText="Miami Fence Co."
|
||||
columns={[
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
title: "Services", items: [
|
||||
{
|
||||
label: "Installation",
|
||||
href: "#products",
|
||||
},
|
||||
label: "Installation", href: "#products"},
|
||||
{
|
||||
label: "Repair",
|
||||
href: "#",
|
||||
},
|
||||
label: "Repair", href: "#"},
|
||||
{
|
||||
label: "Quotes",
|
||||
href: "#contact",
|
||||
},
|
||||
label: "Quotes", href: "#contact"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
title: "Company", items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#",
|
||||
},
|
||||
label: "About Us", href: "#"},
|
||||
{
|
||||
label: "Testimonials",
|
||||
href: "#testimonials",
|
||||
},
|
||||
label: "Testimonials", href: "#testimonials"},
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#faq",
|
||||
},
|
||||
label: "FAQ", href: "#faq"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
title: "Legal", items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
label: "Privacy Policy", href: "#"},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
label: "Terms of Service", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
|
||||
Reference in New Issue
Block a user