Update src/app/page.tsx
This commit is contained in:
356
src/app/page.tsx
356
src/app/page.tsx
@@ -14,255 +14,131 @@ import { Clock, ShieldCheck, Star } from "lucide-react";
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="rounded"
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="background-highlight"
|
||||
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">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "testimonials",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
]}
|
||||
brandName="Velasquez Roofing"
|
||||
button={{
|
||||
text: "Get Estimate",
|
||||
href: "#contact",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Reviews", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Velasquez Roofing"
|
||||
button={{ text: "Get Estimate", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCarouselLogo
|
||||
logoText="VELASQUEZ ROOFING"
|
||||
description="Fast response. Fair pricing. No unnecessary replacements. We fix your roof the right way — the first time."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Free Estimate",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
text: "Call Now",
|
||||
href: "tel:+19312861178",
|
||||
},
|
||||
]}
|
||||
slides={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/photo-ground-texture-pattern_58702-15895.jpg",
|
||||
imageAlt: "professional roofing service home exterior",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-with-helmet-sitting-roof_23-2149343713.jpg",
|
||||
imageAlt: "professional roofing service home exterior",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/specialist-technician-professional-engineer-with-laptop-tablet-maintenance-checking-installing-solar-roof-panel-factory-rooftop-sunlight-engineers-team-survey-check-solar-panel-roof_609648-2178.jpg",
|
||||
imageAlt: "professional roofing service home exterior",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-with-helmet-working-roof-full-shot_23-2149343662.jpg",
|
||||
imageAlt: "professional roofing service home exterior",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-working-roof_23-2149343677.jpg",
|
||||
imageAlt: "professional roofing service home exterior",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-roof-house-made-wooden-tiles_169016-25417.jpg",
|
||||
imageAlt: "professional roofing service home exterior",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCarouselLogo
|
||||
logoText="VELASQUEZ ROOFING"
|
||||
description="Fast response. Fair pricing. No unnecessary replacements. We fix your roof the right way — the first time."
|
||||
buttons={[
|
||||
{ text: "Get Free Estimate", href: "#contact" },
|
||||
{ text: "Call Now", href: "tel:+19312861178" },
|
||||
]}
|
||||
slides={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/photo-ground-texture-pattern_58702-15895.jpg", imageAlt: "professional roofing service home exterior" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-with-helmet-sitting-roof_23-2149343713.jpg", imageAlt: "professional roofing service home exterior" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/specialist-technician-professional-engineer-with-laptop-tablet-maintenance-checking-installing-solar-roof-panel-factory-rooftop-sunlight-engineers-team-survey-check-solar-panel-roof_609648-2178.jpg", imageAlt: "professional roofing service home exterior" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/man-with-helmet-working-roof-full-shot_23-2149343662.jpg", imageAlt: "professional roofing service home exterior" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-working-roof_23-2149343677.jpg", imageAlt: "professional roofing service home exterior" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/closeup-roof-house-made-wooden-tiles_169016-25417.jpg", imageAlt: "professional roofing service home exterior" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<AboutMetric
|
||||
useInvertedBackground={false}
|
||||
title="Why Columbia Trusts Us"
|
||||
metrics={[
|
||||
{
|
||||
icon: Star,
|
||||
label: "Rating",
|
||||
value: "4.8★",
|
||||
},
|
||||
{
|
||||
icon: ShieldCheck,
|
||||
label: "Customer Satisfaction",
|
||||
value: "100%",
|
||||
},
|
||||
{
|
||||
icon: Clock,
|
||||
label: "Service Speed",
|
||||
value: "Fast",
|
||||
},
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<AboutMetric
|
||||
useInvertedBackground={false}
|
||||
title="Why Columbia Trusts Us"
|
||||
metrics={[
|
||||
{ icon: Star, label: "Rating", value: "4.8★" },
|
||||
{ icon: ShieldCheck, label: "Customer Satisfaction", value: "100%" },
|
||||
{ icon: Clock, label: "Service Speed", value: "Fast" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardSeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Roof Repair",
|
||||
description: "Professional repair for all types of roofing issues.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-walking-roof_1321-1041.jpg",
|
||||
imageAlt: "Man walking on the roof",
|
||||
},
|
||||
{
|
||||
title: "Roof Replacement",
|
||||
description: "Full roof installation using top-tier materials.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-roofer-working-with-protection-helmet_23-2149343637.jpg",
|
||||
imageAlt: "Medium shot roofer working with protection helmet",
|
||||
},
|
||||
{
|
||||
title: "Leak Detection",
|
||||
description: "Precision diagnostic tools to find hidden leaks.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/construction-people-working-roof_23-2149343666.jpg",
|
||||
imageAlt: "Construction people working on roof",
|
||||
},
|
||||
{
|
||||
title: "Gutter Services",
|
||||
description: "Seamless gutter installation and cleaning.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/long-shot-men-working-roof_23-2149343673.jpg",
|
||||
imageAlt: "Long shot men working on roof",
|
||||
},
|
||||
{
|
||||
title: "Wood Repair",
|
||||
description: "Fascia and structural wood replacement.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-working-roof_23-2149343654.jpg",
|
||||
imageAlt: "Medium shot smiley man working on roof",
|
||||
},
|
||||
{
|
||||
title: "Storm Damage",
|
||||
description: "Rapid response for emergency storm roof repairs.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-roof-house-made-wooden-tiles_169016-24989.jpg",
|
||||
imageAlt: "Closeup the roof of a house made of wooden tiles",
|
||||
},
|
||||
]}
|
||||
title="Our Expert Services"
|
||||
description="High-quality workmanship with attention to detail and long-lasting protection."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardSeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{ title: "Roof Repair", description: "Professional repair for all types of roofing issues.", imageSrc: "http://img.b2bpic.net/free-photo/man-walking-roof_1321-1041.jpg", imageAlt: "Man walking on the roof" },
|
||||
{ title: "Roof Replacement", description: "Full roof installation using top-tier materials.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-roofer-working-with-protection-helmet_23-2149343637.jpg", imageAlt: "Medium shot roofer working with protection helmet" },
|
||||
{ title: "Leak Detection", description: "Precision diagnostic tools to find hidden leaks.", imageSrc: "http://img.b2bpic.net/free-photo/construction-people-working-roof_23-2149343666.jpg", imageAlt: "Construction people working on roof" },
|
||||
{ title: "Gutter Services", description: "Seamless gutter installation and cleaning.", imageSrc: "http://img.b2bpic.net/free-photo/long-shot-men-working-roof_23-2149343673.jpg", imageAlt: "Long shot men working on roof" },
|
||||
{ title: "Wood Repair", description: "Fascia and structural wood replacement.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-working-roof_23-2149343654.jpg", imageAlt: "Medium shot smiley man working on roof" },
|
||||
{ title: "Storm Damage", description: "Rapid response for emergency storm roof repairs.", imageSrc: "http://img.b2bpic.net/free-photo/closeup-roof-house-made-wooden-tiles_169016-24989.jpg", imageAlt: "Closeup the roof of a house made of wooden tiles" },
|
||||
]}
|
||||
title="Our Expert Services"
|
||||
description="High-quality workmanship with attention to detail and long-lasting protection."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "John D.",
|
||||
role: "Homeowner",
|
||||
testimonial: "Gave a fair quote, showed up quickly, and handled rotten wood perfectly.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-enjoying-cup-matcha-tea_23-2150215071.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Sarah W.",
|
||||
role: "Homeowner",
|
||||
testimonial: "Easy process from estimate to install. Looks amazing.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-standing-garden-showing-ok-gesture-looking-camera_259150-59030.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Mike R.",
|
||||
role: "Homeowner",
|
||||
testimonial: "Worked hard and cleaned everything after. Professionals.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-modern-woman-girl-sitting-couch-using-digital-tablet-reading-ebook_1258-201983.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Emily P.",
|
||||
role: "Homeowner",
|
||||
testimonial: "Solved a leak without trying to oversell me.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiley-father-posing-with-arms-crossed_23-2148414862.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "David L.",
|
||||
role: "Homeowner",
|
||||
testimonial: "On time, fast, and great quality work.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-drinking-coffee-construction-side_329181-3771.jpg",
|
||||
},
|
||||
]}
|
||||
title="Customer Reviews"
|
||||
description="Don't just take our word for it—hear from our satisfied customers."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "1", name: "John D.", role: "Homeowner", testimonial: "Gave a fair quote, showed up quickly, and handled rotten wood perfectly.", imageSrc: "http://img.b2bpic.net/free-photo/man-enjoying-cup-matcha-tea_23-2150215071.jpg" },
|
||||
{ id: "2", name: "Sarah W.", role: "Homeowner", testimonial: "Easy process from estimate to install. Looks amazing.", imageSrc: "http://img.b2bpic.net/free-photo/man-standing-garden-showing-ok-gesture-looking-camera_259150-59030.jpg" },
|
||||
{ id: "3", name: "Mike R.", role: "Homeowner", testimonial: "Worked hard and cleaned everything after. Professionals.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-modern-woman-girl-sitting-couch-using-digital-tablet-reading-ebook_1258-201983.jpg" },
|
||||
{ id: "4", name: "Emily P.", role: "Homeowner", testimonial: "Solved a leak without trying to oversell me.", imageSrc: "http://img.b2bpic.net/free-photo/smiley-father-posing-with-arms-crossed_23-2148414862.jpg" },
|
||||
{ id: "5", name: "David L.", role: "Homeowner", testimonial: "On time, fast, and great quality work.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-drinking-coffee-construction-side_329181-3771.jpg" },
|
||||
]}
|
||||
title="Customer Reviews"
|
||||
description="Don't just take our word for it—hear from our satisfied customers."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="why" data-section="why">
|
||||
<AboutMetric
|
||||
useInvertedBackground={false}
|
||||
title="We Fix Roofs — Not Sell You New Ones"
|
||||
metrics={[
|
||||
{
|
||||
icon: ShieldCheck,
|
||||
label: "Honest Assessments",
|
||||
value: "Yes",
|
||||
},
|
||||
{
|
||||
icon: Clock,
|
||||
label: "Fair Pricing",
|
||||
value: "Transparent",
|
||||
},
|
||||
{
|
||||
icon: Star,
|
||||
label: "Necessary Work Only",
|
||||
value: "Focus",
|
||||
},
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="why" data-section="why">
|
||||
<AboutMetric
|
||||
useInvertedBackground={false}
|
||||
title="We Fix Roofs — Not Sell You New Ones"
|
||||
metrics={[
|
||||
{ icon: ShieldCheck, label: "Honest Assessments", value: "Yes" },
|
||||
{ icon: Clock, label: "Fair Pricing", value: "Transparent" },
|
||||
{ icon: Star, label: "Necessary Work Only", value: "Focus" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
tag="Contact Us"
|
||||
title="Velasquez Roofing"
|
||||
description="Serving Maury County & surrounding areas. 202 Gardendale Dr, Columbia, TN 38401. Call: (931) 286-1178"
|
||||
mediaAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/view-hands-engaged-it-yourself-project_23-2151509510.jpg"
|
||||
imageAlt="View of hands engaged in do it yourself project"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
tag="Contact Us"
|
||||
title="Velasquez Roofing"
|
||||
description="Serving Maury County & surrounding areas. 202 Gardendale Dr, Columbia, TN 38401. Call: (931) 286-1178"
|
||||
mediaAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/view-hands-engaged-it-yourself-project_23-2151509510.jpg"
|
||||
imageAlt="View of hands engaged in do it yourself project"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="VELASQUEZ ROOFING"
|
||||
leftLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Terms of Service",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="VELASQUEZ ROOFING"
|
||||
leftLink={{ text: "Privacy Policy", href: "#" }}
|
||||
rightLink={{ text: "Terms of Service", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user