Merge version_2 into main #3
155
src/app/page.tsx
155
src/app/page.tsx
@@ -2,14 +2,15 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactText from '@/components/sections/contact/ContactText';
|
||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import HeroLogo from '@/components/sections/hero/HeroLogo';
|
||||
import MediaAbout from '@/components/sections/about/MediaAbout';
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
||||
import { AlertTriangle, Shield, Wrench } from "lucide-react";
|
||||
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
|
||||
import { AlertTriangle, Shield, Wrench, BadgeCheck, Zap, HandCoins } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -29,95 +30,70 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home", id: "hero"},
|
||||
{
|
||||
name: "Services", id: "services"},
|
||||
{
|
||||
name: "Why Us", id: "about"},
|
||||
{
|
||||
name: "Testimonials", id: "testimonials"},
|
||||
{
|
||||
name: "Contact", id: "contact"},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Showcase", id: "gallery" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Financing", id: "financing" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Legend Roofing"
|
||||
button={{
|
||||
text: "Get Free Estimate", href: "#contact"}}
|
||||
brandName="Bigfoot Roofing"
|
||||
button={{ text: "Get Free Estimate", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogo
|
||||
logoText="Legend Roofing"
|
||||
description="Roofing You Can Trust. Results You Can See. Serving Jacksonville & Surrounding Areas with premium craftsmanship and $0 down financing."
|
||||
logoText="Bigfoot Roofing"
|
||||
description="Unmatched strength for every home. Serving Jacksonville with premium craftsmanship and reliable protection."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Free Estimate", href: "#contact"},
|
||||
{
|
||||
text: "Call Now", href: "tel:5550123"},
|
||||
{ text: "Get Free Estimate", href: "#contact" },
|
||||
{ text: "Our Process", href: "#about" },
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
imageSrc="https://pixabay.com/get/g020032bc496e4ae32d5f3d8626dda052b053d21e662a154c3b0f59a3f0ac7661ebdf605e05f68b0af6d50f82f777adf8384ee2cda1f6804b66d5ae5d30ff1b33_1280.jpg"
|
||||
imageAlt="Luxury roofing installation project"
|
||||
imageAlt="Luxury roofing project"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<div id="gallery" data-section="gallery">
|
||||
<FeatureCardTwentyFive
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Roof Replacement", description: "Complete top-to-bottom replacement using premium materials.", icon: Shield,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "https://pixabay.com/get/g4340cc520d981a55d30d0df656237044ce61de95473a737c22a7916f0c7b7f6aa84bb250749de4160a34211fc8cc83f4_1280.jpg", imageAlt: "roof inspection construction professional"
|
||||
},
|
||||
{
|
||||
imageSrc: "https://pixabay.com/get/g7d40c1df2d2962c9b79882f86b7ba114956ea615ce892f0c04dd484dff6a15f2be5ad10a98618d4c1724546c716098fb6da3d449eb2515f72f71fd2451bd631b_1280.jpg", imageAlt: "roof inspection construction professional"
|
||||
},
|
||||
],
|
||||
title: "Project Alpha", description: "Custom slate installation with precision detailing.", icon: BadgeCheck,
|
||||
mediaItems: [{ imageSrc: "https://pixabay.com/get/g4340cc520d981a55d30d0df656237044ce61de95473a737c22a7916f0c7b7f6aa84bb250749de4160a34211fc8cc83f4_1280.jpg" }, { imageSrc: "https://pixabay.com/get/g7d40c1df2d2962c9b79882f86b7ba114956ea615ce892f0c04dd484dff6a15f2be5ad10a98618d4c1724546c716098fb6da3d449eb2515f72f71fd2451bd631b_1280.jpg" }]
|
||||
},
|
||||
{
|
||||
title: "Roof Repair", description: "Quick, reliable repairs to protect your investment and family.", icon: Wrench,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "https://pixabay.com/get/g90475ef083931e50d0c8c88972bbc3f25942efd3cc126118711e304d2b34244ed8875479185a086c26be7f40de71f51a45c62f5144005ca1982c257ea0c8d22e_1280.jpg", imageAlt: "roof inspection construction professional"
|
||||
},
|
||||
{
|
||||
imageSrc: "https://pixabay.com/get/ge6de5a3ed08cebcd048c1507f04082653be467cdcee3591e238c57a77cd6de7054a0bcbaef034a028fcbd1bc1590ea5fc16fb907c310506f7fa836833bab783f_1280.jpg", imageAlt: "roof inspection construction professional"
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Storm Damage", description: "Emergency services to restore your roof after severe weather.", icon: AlertTriangle,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "https://pixabay.com/get/g5760bde543a6ebbcdf6ff01dc20fe17fe804e25cf82b32572b80d21db10f4433eec5009431cb65811f77ea27d5392ce4a19bcee30a7b98afbead45efabf5ddbe_1280.jpg", imageAlt: "roof inspection construction professional"
|
||||
},
|
||||
{
|
||||
imageSrc: "https://pixabay.com/get/g473a25bf6d888877d66f90ab06c0f06764ef4e7b2f105872bd3a61f7f6b2deefed6759c7d5ad67569446a8510456ade4481ef9ba2676db1a5d0fba12edc0e9e9_1280.jpg", imageAlt: "roof inspection construction professional"
|
||||
},
|
||||
],
|
||||
},
|
||||
title: "Project Beta", description: "Modern metal roofing with architectural accents.", icon: Zap,
|
||||
mediaItems: [{ imageSrc: "https://pixabay.com/get/g90475ef083931e50d0c8c88972bbc3f25942efd3cc126118711e304d2b34244ed8875479185a086c26be7f40de71f51a45c62f5144005ca1982c257ea0c8d22e_1280.jpg" }, { imageSrc: "https://pixabay.com/get/ge6de5a3ed08cebcd048c1507f04082653be467cdcee3591e238c57a77cd6de7054a0bcbaef034a028fcbd1bc1590ea5fc16fb907c310506f7fa836833bab783f_1280.jpg" }]
|
||||
}
|
||||
]}
|
||||
title="Professional Services"
|
||||
description="We specialize in high-end residential roofing solutions designed for longevity, aesthetics, and unmatched reliability."
|
||||
title="Luxury Project Showcase"
|
||||
description="Before-and-after excellence in high-end roofing."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="financing" data-section="financing">
|
||||
<FeatureCardNineteen
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
title="Flexible Financing"
|
||||
description="We make your roof replacement affordable with flexible payment options tailored to your budget."
|
||||
features={[
|
||||
{ tag: "$0 Down", title: "Zero Down Programs", subtitle: "No upfront cost", description: "Start your project today without needing cash on hand.", icon: HandCoins },
|
||||
{ tag: "Flexible", title: "Monthly Plans", subtitle: "Low monthly installments", description: "Choose a payment plan that fits your family's needs perfectly.", icon: HandCoins }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Built Like a Legend"
|
||||
description="We are a licensed and insured contractor committed to excellence. Our team brings decades of combined experience, using only the best materials to ensure your roof stands the test of time."
|
||||
buttons={[
|
||||
{
|
||||
text: "Learn More", href: "#contact"},
|
||||
]}
|
||||
title="Built Like Bigfoot"
|
||||
description="Bigfoot Roofing isn't just a name; it's a promise of durability, strength, and massive reliability. We stand behind every shingle."
|
||||
imageSrc="https://pixabay.com/get/g89f6e8b075c9f8e08f584501485afeb8e492e3f9b313fe07b24a238234b2cd0fad75a140d6bf91c8526e24a48de7099fe97b6c954af19e9e39b73bdcb2b95e43_1280.jpg"
|
||||
imageAlt="Our expert team at work"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -125,16 +101,8 @@ export default function LandingPage() {
|
||||
<TestimonialCardTwelve
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Sarah J.", imageSrc: "https://pixabay.com/get/gf5581a8cf9a16b59a68040ea9612138ff2c4cc1ff15ab76a48146b2a40b893420995186251b2a3b05e2a6a253ddef79e2554fc546403f9414399cfc1aa618d73_1280.jpg"},
|
||||
{
|
||||
id: "2", name: "Michael K.", imageSrc: "https://pixabay.com/get/g21f651238ea9e8aede891ef59b226795daa0e02b9000e5298c00ec224fdccb42e4196251bc881c4b434feb98b5a41febd94ab933eccdb0a2103ec5a3943cfa3a_1280.jpg"},
|
||||
{
|
||||
id: "3", name: "Emily D.", imageSrc: "https://pixabay.com/get/g38a062bdb3fd0644a979bd8bf9ccd58a2a51a8c157083e4c4d79550219951712a7ad48d2fe74faf320829dc6d6868e63302078b4dacd69b8bae85bf995db00dd_1280.jpg"},
|
||||
{
|
||||
id: "4", name: "David R.", imageSrc: "https://pixabay.com/get/gaba13a6a48a0b36a1afad746b88c6b7fe7417ba525eb27e9c7755f3f47564c36a83e421d97bb400666fde6cbfc97dd074dc886ac0ae0883f9cc02dc88599cca5_1280.jpg"},
|
||||
{
|
||||
id: "5", name: "Linda M.", imageSrc: "https://pixabay.com/get/g7fcd7476ef07346df08795522f6ea2a403d3f7715bb1835826221e3006da474510932b4b1d4c178ffb02d7f623f2daa134e2398162c26a2e57699ad54b07ff9a_1280.jpg"},
|
||||
{ id: "1", name: "Sarah J.", imageSrc: "https://pixabay.com/get/gf5581a8cf9a16b59a68040ea9612138ff2c4cc1ff15ab76a48146b2a40b893420995186251b2a3b05e2a6a253ddef79e2554fc546403f9414399cfc1aa618d73_1280.jpg" },
|
||||
{ id: "2", name: "Michael K.", imageSrc: "https://pixabay.com/get/g21f651238ea9e8aede891ef59b226795daa0e02b9000e5298c00ec224fdccb42e4196251bc881c4b434feb98b5a41febd94ab933eccdb0a2103ec5a3943cfa3a_1280.jpg" }
|
||||
]}
|
||||
cardTitle="Client Success"
|
||||
cardTag="Testimonials"
|
||||
@@ -143,42 +111,27 @@ export default function LandingPage() {
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
<ContactSplit
|
||||
tag="Contact Us"
|
||||
title="Get Your Free Estimate"
|
||||
description="Our experts are ready to provide a no-obligation quote. Simply share your details, and we'll handle the rest."
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "animated-grid"}}
|
||||
text="Ready to get started? Request your free, no-obligation estimate today."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Free Estimate Now", href: "#"},
|
||||
]}
|
||||
inputPlaceholder="Enter your property address"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
<FooterMedia
|
||||
logoText="Bigfoot Roofing"
|
||||
imageSrc="https://pixabay.com/get/g473a25bf6d888877d66f90ab06c0f06764ef4e7b2f105872bd3a61f7f6b2deefed6759c7d5ad67569446a8510456ade4481ef9ba2676db1a5d0fba12edc0e9e9_1280.jpg"
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Home", href: "#hero"},
|
||||
{
|
||||
label: "Services", href: "#services"},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy", href: "#"},
|
||||
{
|
||||
label: "Terms of Service", href: "#"},
|
||||
],
|
||||
},
|
||||
{ title: "Navigation", items: [{ label: "Home", href: "#hero" }, { label: "Gallery", href: "#gallery" }] },
|
||||
{ title: "Support", items: [{ label: "Financing", href: "#financing" }, { label: "Privacy", href: "#" }] }
|
||||
]}
|
||||
logoText="Legend Roofing"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user