190 lines
11 KiB
TypeScript
190 lines
11 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactText from '@/components/sections/contact/ContactText';
|
|
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
|
import FeatureBento from '@/components/sections/feature/FeatureBento';
|
|
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
|
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
|
|
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
|
|
import TextAbout from '@/components/sections/about/TextAbout';
|
|
import { Award, CheckCircle, Download, Droplet, ListChecks, ShieldCheck, Star, Wrench, Hammer } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-stagger"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="pill"
|
|
contentWidth="compact"
|
|
sizing="mediumLarge"
|
|
background="aurora"
|
|
cardStyle="glass-elevated"
|
|
primaryButtonStyle="flat"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleCentered
|
|
navItems={[
|
|
{ name: "Home", id: "hero" },
|
|
{ name: "Services", id: "services" },
|
|
{ name: "Why Choose Us", id: "why-choose-us" },
|
|
{ name: "Testimonials", id: "testimonials" },
|
|
{ name: "Contact", id: "contact" },
|
|
]}
|
|
brandName="Advanced Roof Care"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplitKpi
|
|
background={{ variant: "radial-gradient" }}
|
|
title="Expert Roofing, Done Right."
|
|
description="From roof restorations to leak repairs, Advanced Roof Care delivers meticulous craftsmanship that protects your home for decades. Trusted by 74+ homeowners across Melbourne's south-east."
|
|
kpis={[
|
|
{ value: "74+", label: "Five-Star Reviews" },
|
|
{ value: "20+", label: "Years Experience" },
|
|
{ value: "100%", label: "Satisfaction" }
|
|
]}
|
|
enableKpiAnimation={true}
|
|
tag="Melbourne's Top-Rated Roofer"
|
|
buttons={[
|
|
{ text: "Get a Free Quote", href: "#contact" },
|
|
{ text: "Our Services", href: "#services" }
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-man-working-with-protection-helmet_23-2149343636.jpg"
|
|
imageAlt="Professional roof restoration in Melbourne"
|
|
mediaAnimation="slide-up"
|
|
avatars={[
|
|
{ src: "http://img.b2bpic.net/free-photo/portrait-smiley-woman_23-2149022640.jpg", alt: "Portrait of smiley woman" },
|
|
{ src: "http://img.b2bpic.net/free-photo/smiling-beautiful-middle-aged-business-woman_1262-3085.jpg", alt: "Smiling Beautiful Middle-aged Business Woman" },
|
|
{ src: "http://img.b2bpic.net/free-photo/pleased-successful-female-administrator-office_273609-4124.jpg", alt: "Pleased successful female administrator in office" },
|
|
{ src: "http://img.b2bpic.net/free-photo/woman-wearing-pajamas-while-sitting-bed_273609-13213.jpg", alt: "Woman wearing in pajamas while sitting in bed" },
|
|
{ src: "http://img.b2bpic.net/free-photo/charming-happy-excited-young-caucasian-woman-with-dyed-pinkish-hair-posing-isolated-wearing-nice-red-sweater-laughing-funny-joke-smiling-broadly-showing-her-white-perfect-teeth_343059-4767.jpg", alt: "Charming happy excited young Caucasian woman with dyed pinkish hair posing isolated wearing nice red sweater laughing at funny joke, showing her white perfect teeth" }
|
|
]}
|
|
avatarText="Trusted by local homeowners"
|
|
marqueeItems={[
|
|
{ type: "text", text: "Roof Restoration" },
|
|
{ type: "text", text: "Tile Repairs" },
|
|
{ type: "text", text: "Leak Detection" },
|
|
{ type: "text", text: "Re-Bedding" },
|
|
{ type: "text", text: "Valley Replacement" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="services" data-section="services">
|
|
<FeatureBento
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
useInvertedBackground={true}
|
|
title="Complete Roofing Solutions"
|
|
description="From minor repairs to full restorations, we handle every aspect of your roof with precision and care."
|
|
features={[
|
|
{ title: "Roof Restoration", description: "Full roof makeovers including cleaning, repainting, and sealing. We bring ageing roofs back to life.", bentoComponent: "reveal-icon", icon: Hammer },
|
|
{ title: "Tile Repairs", description: "Cracked, broken, or slipped tiles replaced with expert precision. We match existing tiles seamlessly.", bentoComponent: "reveal-icon", icon: Wrench },
|
|
{ title: "Leak Detection & Repair", description: "Fast, thorough leak investigation and permanent repair. We find the source and fix it right.", bentoComponent: "reveal-icon", icon: Droplet },
|
|
{ title: "Re-Bedding & Pointing", description: "Ridge cap re-bedding and flexible pointing to prevent leaks and secure your roof.", bentoComponent: "reveal-icon", icon: ShieldCheck },
|
|
{ title: "Valley Replacement", description: "Rusted or deteriorated valleys replaced with quality materials to prevent water damage.", bentoComponent: "reveal-icon", icon: Download },
|
|
{ title: "Roof Inspections", description: "Comprehensive inspections with honest assessments and detailed reports.", bentoComponent: "reveal-icon", icon: ListChecks }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="why-choose-us" data-section="why-choose-us">
|
|
<TextAbout
|
|
useInvertedBackground={false}
|
|
tag="Why Choose Us"
|
|
title="Craftsmanship You Can Trust"
|
|
buttons={[{ text: "Call Rob Now", href: "#contact" }]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardOne
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="uniform-all-items-equal"
|
|
useInvertedBackground={true}
|
|
metrics={[
|
|
{ id: "m1", value: "74+", title: "Happy Clients", description: "Five-star reviews and counting.", icon: Star },
|
|
{ id: "m2", value: "20+", title: "Years Experience", description: "Professional roofing mastery.", icon: Award },
|
|
{ id: "m3", value: "0", title: "Negative Reviews", description: "Perfect track record of quality.", icon: CheckCircle }
|
|
]}
|
|
title="Our Track Record"
|
|
description="Quality work that speaks for itself."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSix
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
useInvertedBackground={false}
|
|
title="What Our Clients Say"
|
|
description="Don't just take our word for it. Here's what Melbourne homeowners have to say."
|
|
testimonials={[
|
|
{ id: "1", name: "Susan C.", handle: "Cheltenham", testimonial: "Robert replaced two very rusted valleys on our 70 year-old roof. He is a professional and clearly takes pride in his work.", imageSrc: "http://img.b2bpic.net/free-photo/smiling-business-woman-looking-up-copy-space_1262-3088.jpg" },
|
|
{ id: "2", name: "Melissa T.", handle: "Melbourne", testimonial: "Rob has been one of the best tradespeople we've worked with! He refreshed our early 90s tile roof and it still looks amazing.", imageSrc: "http://img.b2bpic.net/free-photo/man-shirt-smiling-posing-kitchen_23-2148414940.jpg" },
|
|
{ id: "3", name: "Brendan A.", handle: "Melbourne", testimonial: "Rob quoted within a day or two, gave me a date and was spot on. No fuss, no hassle, just careful workmanship.", imageSrc: "http://img.b2bpic.net/free-photo/contemplated-serious-young-man-looking-camera_23-2148130297.jpg" },
|
|
{ id: "4", name: "Sarah J.", handle: "Bentleigh", testimonial: "Fantastic communication and high quality repairs. My roof is leak-free and looks brand new.", imageSrc: "http://img.b2bpic.net/free-photo/young-female-blazer-beauty-blonde_1139-773.jpg" },
|
|
{ id: "5", name: "Mark D.", handle: "Brighton", testimonial: "Honest, reliable and fair pricing. Highly recommended for any roofing needs.", imageSrc: "http://img.b2bpic.net/free-photo/positive-shaved-head-male-dressed-grey-suit-dark-grey-background_613910-11352.jpg" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitText
|
|
useInvertedBackground={true}
|
|
faqs={[
|
|
{ id: "faq1", title: "How long does a roof restoration take?", content: "Most restorations take between 3-5 days depending on the size of the roof and the extent of the work required." },
|
|
{ id: "faq2", title: "Do you provide free quotes?", content: "Yes, we provide obligation-free, transparent quotes within 24-48 hours of our inspection." },
|
|
{ id: "faq3", title: "Are you fully insured?", content: "Yes, we are fully insured and carry all necessary licenses to ensure your home is protected during our work." },
|
|
{ id: "faq4", title: "Do you cover south-east Melbourne?", content: "We proudly serve all south-east Melbourne suburbs with prompt, reliable roofing services." }
|
|
]}
|
|
sideTitle="Common Roofing Questions"
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactText
|
|
useInvertedBackground={false}
|
|
background={{ variant: "plain" }}
|
|
text="Your Roof Deserves The Best Care. Get in touch today for an obligation-free quote. Same-day response, fair pricing, and workmanship guaranteed."
|
|
buttons={[{ text: "Call Rob Now: 0416 424 345", href: "tel:0416424345" }]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterMedia
|
|
imageSrc="http://img.b2bpic.net/free-photo/hand-woven-geometric-denim-area-rug-wooden-floor_169016-48743.jpg"
|
|
logoText="Advanced Roof Care"
|
|
columns={[
|
|
{
|
|
title: "Services", items: [
|
|
{ label: "Roof Restoration", href: "#services" },
|
|
{ label: "Tile Repairs", href: "#services" },
|
|
{ label: "Leak Repairs", href: "#services" },
|
|
{ label: "Valley Replacement", href: "#services" }
|
|
]
|
|
},
|
|
{
|
|
title: "Contact", items: [
|
|
{ label: "0416 424 345", href: "tel:0416424345" },
|
|
{ label: "Cheltenham, VIC", href: "#" }
|
|
]
|
|
}
|
|
]}
|
|
copyrightText="© 2026 Advanced Roof Care. All rights reserved."
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |