Files
35cdd997-ea93-45d5-83fb-e8c…/src/app/page.tsx
2026-04-26 01:01:02 +00:00

453 lines
16 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FeatureBento from '@/components/sections/feature/FeatureBento';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import { Calendar, Camera, CheckCircle, FileText, Send, ShieldCheck, Tool } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="hover-bubble"
defaultTextAnimation="background-highlight"
borderRadius="soft"
contentWidth="medium"
sizing="large"
background="floatingGradient"
cardStyle="gradient-bordered"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="layered"
headingFontWeight="light"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Services",
id: "services",
},
{
name: "Process",
id: "how-it-works",
},
{
name: "Testimonials",
id: "testimonials",
},
{
name: "Contact",
id: "contact",
},
]}
brandName="Roofing USA"
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitTestimonial
useInvertedBackground={true}
background={{
variant: "gradient-bars",
}}
title="Americas Most Trusted Roofing Experts"
description="Facing storm damage, leaks, or an aging roof? Get a FREE professional inspection with advanced drone imaging. No obligation, just expert care."
testimonials={[
{
name: "Sarah J.",
handle: "@customer",
testimonial: "Cooper answered the phone and was at my house that same afternoon. They handled everything with my insurance!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-man-holding-house-model-showing-winner-gesture-shirt-vest-hat-looking-happy-front-view_176474-30662.jpg?_wi=1",
},
{
name: "Michael D.",
handle: "@customer",
testimonial: "Professional, thorough inspection, and we're very happy with the service.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/happy-man-looking-his-girlfriend_23-2148243181.jpg",
},
{
name: "Linda M.",
handle: "@customer",
testimonial: "Highly efficient process. I knew exactly what was happening the whole time.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/modern-woman-home-with-book_23-2147611420.jpg",
},
{
name: "David R.",
handle: "@customer",
testimonial: "The communication was excellent. They exceeded all expectations.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-couple-smiling-very-happy-showing-keys-new-home-moving-buying-new-apartmet-concept_839833-22727.jpg",
},
{
name: "Karen S.",
handle: "@customer",
testimonial: "Roofing USA is committed to making things right. Great experience.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/proper-collaboration-two-carpenter-workers_329181-15626.jpg",
},
]}
buttons={[
{
text: "Get Free Inspection",
href: "#contact",
},
{
text: "Check for Storm Damage",
href: "#contact",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/man-working-with-protection-helmet-full-shot_23-2149343641.jpg?_wi=1"
mediaAnimation="slide-up"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/collaboration-two-carpenters-building_329181-15617.jpg",
alt: "Satisfied client",
},
{
src: "http://img.b2bpic.net/free-photo/young-farmer-taking-care-his-business_329181-15997.jpg",
alt: "Happy homeowner",
},
{
src: "http://img.b2bpic.net/free-photo/close-up-men-holding-thumbs-up_23-2148752021.jpg",
alt: "Satisfied homeowner",
},
{
src: "http://img.b2bpic.net/free-photo/happy-gay-couple-balcony_74855-20307.jpg",
alt: "Happy customer",
},
{
src: "http://img.b2bpic.net/free-photo/portrait-happy-young-man-pointing-camera_1262-3266.jpg",
alt: "Positive client",
},
]}
avatarText="Trusted by 500+ Local Homeowners"
marqueeItems={[
{
type: "text",
text: "Licensed & Insured",
},
{
type: "text",
text: "24/7 Emergency Repairs",
},
{
type: "text",
text: "Insurance Specialists",
},
{
type: "text",
text: "Elite Quality Materials",
},
{
type: "text",
text: "Fast Turnaround",
},
]}
/>
</div>
<div id="pillars" data-section="pillars">
<FeatureBento
animationType="slide-up"
textboxLayout="split-description"
useInvertedBackground={false}
features={[
{
title: "Advanced Inspections",
description: "We utilize cutting-edge drone technology to capture high-definition details of your roof, providing full transparency and accurate reports.",
bentoComponent: "reveal-icon",
icon: Send,
imageSrc: "http://img.b2bpic.net/free-photo/oil-inspector-protective-overalls-orange-helmet-making-notes-transformer_651396-1818.jpg?_wi=1",
imageAlt: "drone technology roof inspection",
},
{
title: "Stress-Free Process",
description: "We act as your dedicated advocates. Our experts deal directly with insurance adjusters so you don't have to navigate complex paperwork alone.",
bentoComponent: "reveal-icon",
icon: FileText,
imageSrc: "http://img.b2bpic.net/free-photo/man-working-with-protection-helmet-full-shot_23-2149343641.jpg?_wi=2",
imageAlt: "drone technology roof inspection",
},
{
title: "Premium Results",
description: "Only the highest quality materials and certified installation teams, ensuring your home is protected with a long-lasting, durable roof.",
bentoComponent: "reveal-icon",
icon: ShieldCheck,
imageSrc: "http://img.b2bpic.net/free-photo/group-businesspeople-working-together-office_23-2147923325.jpg?_wi=1",
imageAlt: "drone technology roof inspection",
},
]}
title="We Handle Everything"
description="Don't just replace your roof—experience a seamless, professional, and insurance-friendly process from start to finish."
/>
</div>
<div id="services" data-section="services">
<TestimonialAboutCard
useInvertedBackground={true}
tag="Our Expertise"
title="Comprehensive Roofing Services"
description="From minor leak repairs to full-scale insurance claim management, our licensed experts provide turn-key solutions tailored to your unique needs."
subdescription="With extensive experience in storm damage mitigation, we prioritize your peace of mind and home safety above all else."
icon={Tool}
imageSrc="http://img.b2bpic.net/free-photo/man-touching-measuring-device-wall-near-power-socket_259150-58248.jpg?_wi=1"
mediaAnimation="blur-reveal"
/>
</div>
<div id="how-it-works" data-section="how-it-works">
<FeatureBento
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
title: "1. Book Free Inspection",
description: "Get in touch today to schedule your assessment at no cost.",
bentoComponent: "reveal-icon",
icon: Calendar,
imageSrc: "http://img.b2bpic.net/free-photo/group-businesspeople-working-together-office_23-2147923325.jpg?_wi=2",
imageAlt: "insurance claim paperwork",
},
{
title: "2. Drone Analysis",
description: "Expert inspection using state-of-the-art imaging technology.",
bentoComponent: "reveal-icon",
icon: Camera,
imageSrc: "http://img.b2bpic.net/free-photo/man-working-with-protection-helmet-full-shot_23-2149343641.jpg?_wi=3",
imageAlt: "insurance claim paperwork",
},
{
title: "3. Claim Assistance",
description: "We document damage and speak directly with your insurance provider.",
bentoComponent: "reveal-icon",
icon: FileText,
imageSrc: "http://img.b2bpic.net/free-photo/oil-inspector-protective-overalls-orange-helmet-making-notes-transformer_651396-1818.jpg?_wi=2",
imageAlt: "insurance claim paperwork",
},
{
title: "4. Expert Installation",
description: "Skilled teams replace your roof with precision and high-grade materials.",
bentoComponent: "reveal-icon",
icon: Tool,
imageSrc: "http://img.b2bpic.net/free-photo/man-touching-measuring-device-wall-near-power-socket_259150-58248.jpg?_wi=2",
imageAlt: "insurance claim paperwork",
},
{
title: "5. Peace of Mind",
description: "Enjoy a worry-free home with a renewed, durable roof system.",
bentoComponent: "reveal-icon",
icon: CheckCircle,
imageSrc: "http://img.b2bpic.net/free-photo/young-man-holding-house-model-showing-winner-gesture-shirt-vest-hat-looking-happy-front-view_176474-30662.jpg?_wi=2",
imageAlt: "insurance claim paperwork",
},
]}
title="Simple 5-Step Process"
description="Our transparent process removes the headache from home maintenance and insurance claims."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardOne
animationType="slide-up"
textboxLayout="split"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={true}
testimonials={[
{
id: "1",
name: "Sarah J.",
role: "Homeowner",
company: "Mt. Pleasant",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/people-practicing-social-integration-workspace_23-2149405354.jpg",
},
{
id: "2",
name: "Michael D.",
role: "Homeowner",
company: "Client",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/blond-businessman-happy-expression_1194-3666.jpg",
},
{
id: "3",
name: "Linda M.",
role: "Homeowner",
company: "Client",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/indoor-image-optimistic-energetic-mature-businesswoman-with-short-blonde-hair-posing-stylish-office-interior-with-arms-folded-her-chest-looking-camera-with-confident-happy-smile_343059-2245.jpg",
},
{
id: "4",
name: "David R.",
role: "Homeowner",
company: "Client",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/workers-having-little-chat-while-having-cup-coffee_329181-15605.jpg",
},
{
id: "5",
name: "Karen S.",
role: "Homeowner",
company: "Client",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/worker-with-hard-hat-level-checking-roof-timber_23-2148748853.jpg",
},
]}
title="Real Results"
description="See why hundreds of homeowners trust us as their primary roofing partner."
/>
</div>
<div id="offer" data-section="offer">
<MetricCardSeven
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={false}
metrics={[
{
id: "m1",
value: "FREE",
title: "Inspection",
items: [
"No Obligation",
"Fast Turnaround",
"Drone Technology",
],
},
{
id: "m2",
value: "LOW",
title: "Deductible",
items: [
"Insurance Advocacy",
"Direct Billing",
"Paperwork Handled",
],
},
]}
title="Could You Qualify?"
description="If your home has experienced recent storm or hail damage, your insurance may cover most—or all—of your roof replacement."
/>
</div>
<div id="local" data-section="local">
<SocialProofOne
textboxLayout="split"
useInvertedBackground={true}
names={[
"Mt. Pleasant",
"Charleston Area",
"Daniel Island",
"Isle of Palms",
"Sullivan's Island",
"Summerville",
"Goose Creek",
]}
title="Serving Homeowners Like You"
description="We proudly serve Mt. Pleasant and surrounding communities. Past storms may have caused invisible wear—let our experts check your roof at no cost."
/>
</div>
<div id="faq" data-section="faq">
<FaqDouble
textboxLayout="split"
useInvertedBackground={false}
faqs={[
{
id: "f1",
title: "How much does an inspection cost?",
content: "Our professional drone inspection is 100% free with no obligation.",
},
{
id: "f2",
title: "Will you work with my insurance?",
content: "Yes, we are specialists in insurance claim assistance and act as your advocate throughout the process.",
},
{
id: "f3",
title: "How long does a replacement take?",
content: "Most residential replacements are completed efficiently, typically within a few days depending on roof size.",
},
{
id: "f4",
title: "Do you offer warranties?",
content: "Yes, we stand by our work with premium material and installation warranties.",
},
]}
title="Common Questions"
description="Need more info about the roofing process or insurance claims? We've got you covered."
faqsAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
useInvertedBackground={true}
background={{
variant: "gradient-bars",
}}
title="Don't Wait Until Damage Gets Worse"
description="Schedule your professional inspection today. A few minutes now could save you thousands in future repairs."
buttonText="Schedule Free Inspection"
tag="Contact Us"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
columns={[
{
items: [
{
label: "Services",
href: "#services",
},
{
label: "Our Process",
href: "#how-it-works",
},
{
label: "Contact Us",
href: "#contact",
},
],
},
{
items: [
{
label: "Privacy Policy",
href: "#",
},
{
label: "Terms of Service",
href: "#",
},
{
label: "License: #12345",
href: "#",
},
],
},
]}
logoText="Roofing USA"
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}