Merge version_1 into main #2
215
src/app/page.tsx
215
src/app/page.tsx
@@ -30,22 +30,10 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "#hero",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "#services",
|
||||
},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "#reviews",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Reviews", id: "reviews" },
|
||||
{ name: "About", id: "about" }
|
||||
]}
|
||||
brandName="Custom Roofing SC"
|
||||
/>
|
||||
@@ -53,80 +41,35 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitKpi
|
||||
background="gradient-bars"
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="South Carolina's Most Trusted Roof. Built to Last Decades."
|
||||
description="Serving homeowners since 2002 — on time, on budget, done right."
|
||||
kpis={[
|
||||
{
|
||||
value: "20+",
|
||||
label: "Years Experience",
|
||||
},
|
||||
{
|
||||
value: "Licensed",
|
||||
label: "& Insured",
|
||||
},
|
||||
{
|
||||
value: "Free",
|
||||
label: "Estimates",
|
||||
},
|
||||
{ value: "20+", label: "Years Experience" },
|
||||
{ value: "Licensed", label: "& Insured" },
|
||||
{ value: "Free", label: "Estimates" }
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
buttons={[
|
||||
{
|
||||
text: "Get a Free Estimate",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
text: "See Our Work",
|
||||
href: "#services",
|
||||
},
|
||||
{ text: "Get a Free Estimate", href: "#contact" },
|
||||
{ text: "See Our Work", href: "#services" }
|
||||
]}
|
||||
imageSrc="https://pixabay.com/get/g0254c648e2e2255ae3348761b6ece15e14fbe2eb5de9665398bd90b31547d11448ef367fe4e426360e0d2a7b8c6565a3_1280.jpg?_wi=1"
|
||||
imageSrc="https://pixabay.com/get/g0254c648e2e2255ae3348761b6ece15e14fbe2eb5de9665398bd90b31547d11448ef367fe4e426360e0d2a7b8c6565a3_1280.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "https://pixabay.com/get/ga1957a77bf0969361691174aabc996a9e3afcd73c3d8d4cae031895a05d675ec3d4b66362a3142b924addb036f12e0b67437c402f98e319fe4b1752e98d72723_1280.jpg",
|
||||
alt: "Client 1",
|
||||
},
|
||||
{
|
||||
src: "https://pixabay.com/get/g2e28dbc2d4bddbf51efdb5dd0d2f04572b1254c2c098134d8c928d37883039e9d91951c240a8c63a42ab37f3a3194ed0c81af15ec4817dee3db4ca0d7ae690b0_1280.jpg",
|
||||
alt: "Client 2",
|
||||
},
|
||||
{
|
||||
src: "https://pixabay.com/get/gb459929dd52b7e093034ffd3b58ab8f94334343e6b69ee95cd698ca0f69988085b7724859c5ede3d83df250ca0382d4fe920c2ded8a40259cc1a9b197512621d_1280.jpg",
|
||||
alt: "Client 3",
|
||||
},
|
||||
{
|
||||
src: "https://pixabay.com/get/ga1957a77bf0969361691174aabc996a9e3afcd73c3d8d4cae031895a05d675ec3d4b66362a3142b924addb036f12e0b67437c402f98e319fe4b1752e98d72723_1280.jpg",
|
||||
alt: "Client 4",
|
||||
},
|
||||
{
|
||||
src: "https://pixabay.com/get/g2e28dbc2d4bddbf51efdb5dd0d2f04572b1254c2c098134d8c928d37883039e9d91951c240a8c63a42ab37f3a3194ed0c81af15ec4817dee3db4ca0d7ae690b0_1280.jpg",
|
||||
alt: "Client 5",
|
||||
},
|
||||
{ src: "https://pixabay.com/get/ga1957a77bf0969361691174aabc996a9e3afcd73c3d8d4cae031895a05d675ec3d4b66362a3142b924addb036f12e0b67437c402f98e319fe4b1752e98d72723_1280.jpg", alt: "Client 1" },
|
||||
{ src: "https://pixabay.com/get/g2e28dbc2d4bddbf51efdb5dd0d2f04572b1254c2c098134d8c928d37883039e9d91951c240a8c63a42ab37f3a3194ed0c81af15ec4817dee3db4ca0d7ae690b0_1280.jpg", alt: "Client 2" },
|
||||
{ src: "https://pixabay.com/get/gb459929dd52b7e093034ffd3b58ab8f94334343e6b69ee95cd698ca0f69988085b7724859c5ede3d83df250ca0382d4fe920c2ded8a40259cc1a9b197512621d_1280.jpg", alt: "Client 3" },
|
||||
{ src: "https://pixabay.com/get/ga1957a77bf0969361691174aabc996a9e3afcd73c3d8d4cae031895a05d675ec3d4b66362a3142b924addb036f12e0b67437c402f98e319fe4b1752e98d72723_1280.jpg", alt: "Client 4" },
|
||||
{ src: "https://pixabay.com/get/g2e28dbc2d4bddbf51efdb5dd0d2f04572b1254c2c098134d8c928d37883039e9d91951c240a8c63a42ab37f3a3194ed0c81af15ec4817dee3db4ca0d7ae690b0_1280.jpg", alt: "Client 5" }
|
||||
]}
|
||||
avatarText="Trusted by 500+ SC families"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Asphalt Shingles",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Metal Roofing",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Storm Repair",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Gutter Service",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Roof Inspection",
|
||||
},
|
||||
{ type: "text", text: "Asphalt Shingles" },
|
||||
{ type: "text", text: "Metal Roofing" },
|
||||
{ type: "text", text: "Storm Repair" },
|
||||
{ type: "text", text: "Gutter Service" },
|
||||
{ type: "text", text: "Roof Inspection" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -138,29 +81,14 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "On-Time Arrival",
|
||||
description: "We respect your schedule and your time. If we say we'll be there, we'll be there.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: Clock,
|
||||
imageSrc: "https://pixabay.com/get/g0254c648e2e2255ae3348761b6ece15e14fbe2eb5de9665398bd90b31547d11448ef367fe4e426360e0d2a7b8c6565a3_1280.jpg?_wi=2",
|
||||
imageAlt: "luxury roofing background texture slate",
|
||||
title: "On-Time Arrival", description: "We respect your schedule and your time. If we say we'll be there, we'll be there.", bentoComponent: "reveal-icon", icon: Clock
|
||||
},
|
||||
{
|
||||
title: "Thorough Estimates",
|
||||
description: "No hidden costs, no surprises. Detailed proposals delivered right when we promise.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: FileText,
|
||||
imageSrc: "https://pixabay.com/get/gfaa7de163e3deb3d8acd10cefb12e7e92a179751674d0ef8350bc0e4a27e083183211921671eca735c992a1a687a232c9440b7c0ca4394238b62693e4ad9c2ca_1280.jpg",
|
||||
imageAlt: "clock icon simple minimalist",
|
||||
title: "Thorough Estimates", description: "No hidden costs, no surprises. Detailed proposals delivered right when we promise.", bentoComponent: "reveal-icon", icon: FileText
|
||||
},
|
||||
{
|
||||
title: "Responsive Communication",
|
||||
description: "From first call to job completion, you'll never wonder about the status of your roof.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: MessageSquare,
|
||||
imageSrc: "https://pixabay.com/get/gcd380908df526683dd9d5ae238f45a1d2280897431e53bd4b454a7f20baa4f99eec05db1a1a4d709053d0af1a423f632d0c801b4bf4adf52bf97a77c4f5d2e07_1280.jpg",
|
||||
imageAlt: "clipboard icon detailed estimate",
|
||||
},
|
||||
title: "Responsive Communication", description: "From first call to job completion, you'll never wonder about the status of your roof.", bentoComponent: "reveal-icon", icon: MessageSquare
|
||||
}
|
||||
]}
|
||||
title="Why Choose Custom Roofing"
|
||||
description="We don't just put shingles on roofs; we build lasting relationships with our neighbors."
|
||||
@@ -171,29 +99,18 @@ export default function LandingPage() {
|
||||
<ProductCardFour
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Full Roof Replacement",
|
||||
price: "Expert Install",
|
||||
variant: "Luxury Shingles",
|
||||
imageSrc: "https://pixabay.com/get/g0254c648e2e2255ae3348761b6ece15e14fbe2eb5de9665398bd90b31547d11448ef367fe4e426360e0d2a7b8c6565a3_1280.jpg?_wi=3",
|
||||
id: "p1", name: "Full Roof Replacement", price: "Expert Install", variant: "Luxury Shingles", imageSrc: "https://pixabay.com/get/g0254c648e2e2255ae3348761b6ece15e14fbe2eb5de9665398bd90b31547d11448ef367fe4e426360e0d2a7b8c6565a3_1280.jpg"
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Roof Repair",
|
||||
price: "Fast Response",
|
||||
variant: "Precision Patching",
|
||||
imageSrc: "https://pixabay.com/get/g0254c648e2e2255ae3348761b6ece15e14fbe2eb5de9665398bd90b31547d11448ef367fe4e426360e0d2a7b8c6565a3_1280.jpg?_wi=4",
|
||||
id: "p2", name: "Roof Repair", price: "Fast Response", variant: "Precision Patching", imageSrc: "https://pixabay.com/get/g0254c648e2e2255ae3348761b6ece15e14fbe2eb5de9665398bd90b31547d11448ef367fe4e426360e0d2a7b8c6565a3_1280.jpg"
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Storm Damage",
|
||||
price: "Priority Service",
|
||||
variant: "Insurance Assistance",
|
||||
imageSrc: "https://pixabay.com/get/g0254c648e2e2255ae3348761b6ece15e14fbe2eb5de9665398bd90b31547d11448ef367fe4e426360e0d2a7b8c6565a3_1280.jpg?_wi=5",
|
||||
},
|
||||
id: "p3", name: "Storm Damage", price: "Priority Service", variant: "Insurance Assistance", imageSrc: "https://pixabay.com/get/g0254c648e2e2255ae3348761b6ece15e14fbe2eb5de9665398bd90b31547d11448ef367fe4e426360e0d2a7b8c6565a3_1280.jpg"
|
||||
}
|
||||
]}
|
||||
title="Residential Roofing Services"
|
||||
description="Premium craftmanship for South Carolina homes."
|
||||
@@ -207,26 +124,11 @@ export default function LandingPage() {
|
||||
rating={5}
|
||||
author="K. Hunter Burbage"
|
||||
avatars={[
|
||||
{
|
||||
src: "https://pixabay.com/get/ga1957a77bf0969361691174aabc996a9e3afcd73c3d8d4cae031895a05d675ec3d4b66362a3142b924addb036f12e0b67437c402f98e319fe4b1752e98d72723_1280.jpg",
|
||||
alt: "Client 1",
|
||||
},
|
||||
{
|
||||
src: "https://pixabay.com/get/g2e28dbc2d4bddbf51efdb5dd0d2f04572b1254c2c098134d8c928d37883039e9d91951c240a8c63a42ab37f3a3194ed0c81af15ec4817dee3db4ca0d7ae690b0_1280.jpg",
|
||||
alt: "Client 2",
|
||||
},
|
||||
{
|
||||
src: "https://pixabay.com/get/gb459929dd52b7e093034ffd3b58ab8f94334343e6b69ee95cd698ca0f69988085b7724859c5ede3d83df250ca0382d4fe920c2ded8a40259cc1a9b197512621d_1280.jpg",
|
||||
alt: "Client 3",
|
||||
},
|
||||
{
|
||||
src: "https://pixabay.com/get/ga1957a77bf0969361691174aabc996a9e3afcd73c3d8d4cae031895a05d675ec3d4b66362a3142b924addb036f12e0b67437c402f98e319fe4b1752e98d72723_1280.jpg",
|
||||
alt: "Client 4",
|
||||
},
|
||||
{
|
||||
src: "https://pixabay.com/get/g2e28dbc2d4bddbf51efdb5dd0d2f04572b1254c2c098134d8c928d37883039e9d91951c240a8c63a42ab37f3a3194ed0c81af15ec4817dee3db4ca0d7ae690b0_1280.jpg",
|
||||
alt: "Client 5",
|
||||
},
|
||||
{ src: "https://pixabay.com/get/ga1957a77bf0969361691174aabc996a9e3afcd73c3d8d4cae031895a05d675ec3d4b66362a3142b924addb036f12e0b67437c402f98e319fe4b1752e98d72723_1280.jpg", alt: "Client 1" },
|
||||
{ src: "https://pixabay.com/get/g2e28dbc2d4bddbf51efdb5dd0d2f04572b1254c2c098134d8c928d37883039e9d91951c240a8c63a42ab37f3a3194ed0c81af15ec4817dee3db4ca0d7ae690b0_1280.jpg", alt: "Client 2" },
|
||||
{ src: "https://pixabay.com/get/gb459929dd52b7e093034ffd3b58ab8f94334343e6b69ee95cd698ca0f69988085b7724859c5ede3d83df250ca0382d4fe920c2ded8a40259cc1a9b197512621d_1280.jpg", alt: "Client 3" },
|
||||
{ src: "https://pixabay.com/get/ga1957a77bf0969361691174aabc996a9e3afcd73c3d8d4cae031895a05d675ec3d4b66362a3142b924addb036f12e0b67437c402f98e319fe4b1752e98d72723_1280.jpg", alt: "Client 4" },
|
||||
{ src: "https://pixabay.com/get/g2e28dbc2d4bddbf51efdb5dd0d2f04572b1254c2c098134d8c928d37883039e9d91951c240a8c63a42ab37f3a3194ed0c81af15ec4817dee3db4ca0d7ae690b0_1280.jpg", alt: "Client 5" }
|
||||
]}
|
||||
ratingAnimation="slide-up"
|
||||
avatarsAnimation="blur-reveal"
|
||||
@@ -237,21 +139,14 @@ export default function LandingPage() {
|
||||
<TextAbout
|
||||
useInvertedBackground={false}
|
||||
title="A Legacy of Trust Since 2002"
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Us",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Contact Us", href: "#contact" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="cta" data-section="cta">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
tag="FREE ESTIMATE"
|
||||
title="Ready for a Roof That Lasts?"
|
||||
description="Get your free, no-pressure estimate today. We'll show up when we say we will."
|
||||
@@ -261,9 +156,7 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
background={{ variant: "plain" }}
|
||||
tag="GET IN TOUCH"
|
||||
title="Schedule Your Free Consultation"
|
||||
description="We serve homeowners across South Carolina. Give us a call or send us a message below."
|
||||
@@ -274,31 +167,17 @@ export default function LandingPage() {
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Services",
|
||||
href: "#services",
|
||||
},
|
||||
],
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "#about" },
|
||||
{ label: "Services", href: "#services" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
{
|
||||
label: "(803) 555-0123",
|
||||
href: "tel:8035550123",
|
||||
},
|
||||
{
|
||||
label: "South Carolina",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
title: "Contact", items: [
|
||||
{ label: "(803) 555-0123", href: "tel:8035550123" },
|
||||
{ label: "South Carolina", href: "#" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
bottomLeftText="© 2024 Custom Roofing of South Carolina, Inc."
|
||||
bottomRightText="Licensed & Insured"
|
||||
|
||||
Reference in New Issue
Block a user