Merge version_1 into main

Merge version_1 into main
This commit was merged in pull request #2.
This commit is contained in:
2026-04-04 22:39:14 +00:00
4 changed files with 170 additions and 746 deletions

View File

@@ -2,133 +2,44 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import AboutMetric from '@/components/sections/about/AboutMetric';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import { Clock, Mail, Phone } from "lucide-react";
export default function LandingPage() {
export default function ContactPage() {
return (
<ThemeProvider
defaultButtonVariant="hover-bubble"
defaultTextAnimation="reveal-blur"
borderRadius="rounded"
defaultButtonVariant="hover-bubble"
defaultTextAnimation="reveal-blur"
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: "/",
},
{
name: "Services",
id: "/services",
},
{
name: "Gallery",
id: "/gallery",
},
{
name: "Contact",
id: "/contact",
},
]}
brandName="High Rise Roofing"
/>
</div>
<div id="contact-body" data-section="contact-body">
<ContactCTA
useInvertedBackground={true}
background={{
variant: "plain",
}}
tag="Get in touch"
title="Ready to improve your roof?"
description="Request your free inspection and quote from our expert team."
buttons={[
{
text: "Call Us Now",
href: "tel:0800123456",
},
{
text: "Request Quote",
href: "#",
},
]}
/>
</div>
<div id="about" data-section="about">
<AboutMetric
useInvertedBackground={false}
title="Contact Us Info"
metrics={[
{
icon: Phone,
label: "Support",
value: "0800-123-456",
},
{
icon: Mail,
label: "Email",
value: "info@highrise.com",
},
{
icon: Clock,
label: "Hours",
value: "9am-6pm",
},
]}
metricsAnimation="opacity"
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="High Rise Roofing"
columns={[
{
title: "Services",
items: [
{
label: "Installation",
href: "/services",
},
{
label: "Repairs",
href: "/services",
},
{
label: "Inspections",
href: "/services",
},
],
},
{
title: "Company",
items: [
{
label: "About Us",
href: "/about",
},
{
label: "Our Work",
href: "/gallery",
},
{
label: "Contact",
href: "/contact",
},
],
},
]}
/>
</div>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[{ name: "Home", id: "/" }, { name: "Services", id: "/services" }, { name: "Gallery", id: "/gallery" }, { name: "Contact", id: "/contact" }]}
brandName="High Rise Roofing"
button={{ text: "Get Quote", href: "/contact" }}
/>
</div>
<div id="contact-body" data-section="contact-body">
<ContactCTA
tag="Contact"
title="Ready to improve your roof?"
description="Reach out to us today."
buttons={[{ text: "Call", href: "#" }]}
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard logoText="High Rise Roofing" columns={[]} />
</div>
</ReactLenis>
</ThemeProvider>
);
}
}

View File

@@ -2,159 +2,50 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import AboutMetric from '@/components/sections/about/AboutMetric';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import { Camera, MapPin, Star } from "lucide-react";
export default function LandingPage() {
export default function GalleryPage() {
return (
<ThemeProvider
defaultButtonVariant="hover-bubble"
defaultTextAnimation="reveal-blur"
borderRadius="rounded"
defaultButtonVariant="hover-bubble"
defaultTextAnimation="reveal-blur"
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: "/",
},
{
name: "Services",
id: "/services",
},
{
name: "Gallery",
id: "/gallery",
},
{
name: "Contact",
id: "/contact",
},
]}
brandName="High Rise Roofing"
/>
</div>
<div id="gallery-body" data-section="gallery-body">
<ProductCardOne
textboxLayout="default"
gridVariant="bento-grid"
useInvertedBackground={false}
products={[
{
id: "g1",
name: "Before & After",
price: "Completed",
imageSrc: "http://img.b2bpic.net/free-photo/residential-house_53876-23089.jpg?_wi=3",
},
{
id: "g2",
name: "Detail Shot",
price: "Completed",
imageSrc: "http://img.b2bpic.net/free-photo/brick-wall-background-texture_1048-16945.jpg?_wi=4",
},
{
id: "g3",
name: "Wide Exterior",
price: "Completed",
imageSrc: "http://img.b2bpic.net/free-photo/facade-modern-new-building_23-2147694757.jpg?_wi=3",
},
{
id: "g4",
name: "Roof Slate",
price: "Completed",
imageSrc: "http://img.b2bpic.net/free-photo/residential-house_53876-23089.jpg?_wi=4",
},
{
id: "g5",
name: "Skylight Install",
price: "Completed",
imageSrc: "http://img.b2bpic.net/free-photo/brick-wall-background-texture_1048-16945.jpg?_wi=5",
},
{
id: "g6",
name: "Property View",
price: "Completed",
imageSrc: "http://img.b2bpic.net/free-photo/facade-modern-new-building_23-2147694757.jpg?_wi=4",
},
]}
title="Our Craftsmanship"
description="See the precision behind every project."
/>
</div>
<div id="about" data-section="about">
<AboutMetric
useInvertedBackground={false}
title="Gallery Stats"
metrics={[
{
icon: Camera,
label: "Projects Captured",
value: "200+",
},
{
icon: MapPin,
label: "Regions Served",
value: "5",
},
{
icon: Star,
label: "Avg Rating",
value: "4.9",
},
]}
metricsAnimation="blur-reveal"
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="High Rise Roofing"
columns={[
{
title: "Services",
items: [
{
label: "Installation",
href: "/services",
},
{
label: "Repairs",
href: "/services",
},
{
label: "Inspections",
href: "/services",
},
],
},
{
title: "Company",
items: [
{
label: "About Us",
href: "/about",
},
{
label: "Our Work",
href: "/gallery",
},
{
label: "Contact",
href: "/contact",
},
],
},
]}
/>
</div>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[{ name: "Home", id: "/" }, { name: "Services", id: "/services" }, { name: "Gallery", id: "/gallery" }, { name: "Contact", id: "/contact" }]}
brandName="High Rise Roofing"
button={{ text: "Get Quote", href: "/contact" }}
/>
</div>
<div id="gallery-body" data-section="gallery-body">
<ProductCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="bento-grid"
products={[
{ id: "g1", name: "Work 1", price: "Done", imageSrc: "http://img.b2bpic.net/free-photo/residential-house_53876-23089.jpg" },
{ id: "g2", name: "Work 2", price: "Done", imageSrc: "http://img.b2bpic.net/free-photo/brick-wall-background-texture_1048-16945.jpg" },
{ id: "g3", name: "Work 3", price: "Done", imageSrc: "http://img.b2bpic.net/free-photo/facade-modern-new-building_23-2147694757.jpg" }
]}
title="Our Craftsmanship"
description="See the precision."
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard logoText="High Rise Roofing" columns={[]} />
</div>
</ReactLenis>
</ThemeProvider>
);
}
}

View File

@@ -2,349 +2,81 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import { CheckCircle, Shield, Star } from "lucide-react";
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import { Shield, CheckCircle, Star, Zap, Wrench, Search, Maximize } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="hover-bubble"
defaultTextAnimation="reveal-blur"
borderRadius="rounded"
defaultButtonVariant="hover-bubble"
defaultTextAnimation="reveal-blur"
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: "/",
},
{
name: "Services",
id: "/services",
},
{
name: "Gallery",
id: "/gallery",
},
{
name: "Contact",
id: "/contact",
},
]}
brandName="High Rise Roofing"
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitDoubleCarousel
background={{
variant: "gradient-bars",
}}
title="Built to Last. Crafted to Perfection."
description="Premium roofing solutions with unmatched craftsmanship, honesty, and structural expertise."
leftCarouselItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/modern-country-houses-construction_1385-20.jpg?_wi=1",
imageAlt: "Roofing installation",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/residential-house_53876-23089.jpg?_wi=1",
imageAlt: "Construction site",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/brick-wall-background-texture_1048-16945.jpg?_wi=1",
imageAlt: "Craftsmanship detail",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/facade-modern-new-building_23-2147694757.jpg?_wi=1",
imageAlt: "Wide architectural shot",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/modern-country-houses-construction_1385-20.jpg?_wi=2",
imageAlt: "Sunset installation",
},
]}
rightCarouselItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/brick-wall-background-texture_1048-16945.jpg?_wi=2",
imageAlt: "Close up craftsmanship",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/facade-modern-new-building_23-2147694757.jpg?_wi=2",
imageAlt: "Drone shot",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/modern-country-houses-construction_1385-20.jpg?_wi=3",
imageAlt: "Sunset roof",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/residential-house_53876-23089.jpg?_wi=2",
imageAlt: "Refurbished home",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/brick-wall-background-texture_1048-16945.jpg?_wi=3",
imageAlt: "Slate texture",
},
]}
buttons={[
{
text: "Get a Free Quote",
href: "/contact",
},
{
text: "View Our Work",
href: "/gallery",
},
]}
avatars={[
{
src: "http://img.b2bpic.net/free-photo/young-woman-giving-thumbs-up-gray-wall_114579-63637.jpg",
alt: "Client 1",
},
{
src: "http://img.b2bpic.net/free-photo/young-woman-giving-thumbs-up-gray-wall_114579-63637.jpg",
alt: "Client 2",
},
{
src: "http://img.b2bpic.net/free-photo/young-woman-giving-thumbs-up-gray-wall_114579-63637.jpg",
alt: "Client 3",
},
{
src: "http://img.b2bpic.net/free-photo/young-woman-giving-thumbs-up-gray-wall_114579-63637.jpg",
alt: "Client 4",
},
{
src: "http://img.b2bpic.net/free-photo/young-woman-giving-thumbs-up-gray-wall_114579-63637.jpg",
alt: "Client 5",
},
]}
avatarText="Trusted by 500+ happy homeowners"
marqueeItems={[
{
type: "text",
text: "High-End Roofing",
},
{
type: "text",
text: "Certified Experts",
},
{
type: "text",
text: "Premium Materials",
},
{
type: "text",
text: "Insured Craftsmanship",
},
{
type: "text",
text: "Reliable Service",
},
]}
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardOne
animationType="slide-up"
textboxLayout="split-description"
gridVariant="bento-grid"
useInvertedBackground={false}
metrics={[
{
id: "m1",
value: "10+",
title: "Years Experience",
description: "Proven industry expertise",
icon: Shield,
},
{
id: "m2",
value: "100%",
title: "Insured Work",
description: "Full peace of mind",
icon: CheckCircle,
},
{
id: "m3",
value: "500+",
title: "Satisfied Clients",
description: "5-star project history",
icon: Star,
},
]}
title="Unrivaled Trust"
description="We deliver excellence in every square inch."
/>
</div>
<div id="services" data-section="services">
<FeatureCardTwentySix
textboxLayout="default"
useInvertedBackground={true}
features={[
{
title: "Roof Installation",
description: "Premium installations built to last.",
imageSrc: "http://img.b2bpic.net/free-photo/worker-cuts-steel-profiles-drywall-close-up-selective-focus-preparing-installation-ceiling-profile-system-frame-renovation-repair_166373-1903.jpg?_wi=1",
buttonIcon: "Zap",
},
{
title: "Roof Repairs",
description: "Permanent fixes for leaks and damage.",
imageSrc: "http://img.b2bpic.net/free-photo/i-phrase-embedded-grey-tissue_114579-18369.jpg?_wi=1",
buttonIcon: "Wrench",
},
{
title: "Inspections",
description: "Uncovering issues before they grow.",
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-roofer-working-with-helmet_23-2149343710.jpg?_wi=1",
buttonIcon: "Search",
},
{
title: "Flat Roofing",
description: "Modern solutions for flat surfaces.",
imageSrc: "http://img.b2bpic.net/free-photo/worker-cuts-steel-profiles-drywall-close-up-selective-focus-preparing-installation-ceiling-profile-system-frame-renovation-repair_166373-1903.jpg?_wi=2",
buttonIcon: "Maximize",
},
]}
title="Roofing Done Right"
description="From minor repairs to comprehensive structural corrections, we handle it all."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardSixteen
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={false}
testimonials={[
{
id: "t1",
name: "Sarah Miller",
role: "Homeowner",
company: "London",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-giving-thumbs-up-gray-wall_114579-63637.jpg?_wi=1",
},
{
id: "t2",
name: "John Davis",
role: "Property Manager",
company: "Essex",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-giving-thumbs-up-gray-wall_114579-63637.jpg?_wi=2",
},
{
id: "t3",
name: "Emily Watson",
role: "Owner",
company: "Surrey",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-giving-thumbs-up-gray-wall_114579-63637.jpg?_wi=3",
},
{
id: "t4",
name: "Robert King",
role: "Resident",
company: "Kent",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-giving-thumbs-up-gray-wall_114579-63637.jpg?_wi=4",
},
{
id: "t5",
name: "Alice Brown",
role: "Homeowner",
company: "Sussex",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-giving-thumbs-up-gray-wall_114579-63637.jpg?_wi=5",
},
]}
kpiItems={[
{
value: "98%",
label: "Client Retention",
},
{
value: "4.9/5",
label: "Average Rating",
},
{
value: "100%",
label: "Satisfaction Guaranteed",
},
]}
title="Client Success"
description="See why homeowners choose High Rise."
/>
</div>
<div id="socialProof" data-section="socialProof">
<SocialProofOne
textboxLayout="default"
useInvertedBackground={false}
title="Trusted Partners"
description="Working with industry leaders."
names={[
"Architect Guild",
"Luxury Home Builders",
"Urban Development",
"Eco Roofing Co",
"Stone Master Materials",
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="High Rise Roofing"
columns={[
{
title: "Services",
items: [
{
label: "Installation",
href: "/services",
},
{
label: "Repairs",
href: "/services",
},
{
label: "Inspections",
href: "/services",
},
],
},
{
title: "Company",
items: [
{
label: "About Us",
href: "/about",
},
{
label: "Our Work",
href: "/gallery",
},
{
label: "Contact",
href: "/contact",
},
],
},
]}
/>
</div>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[{ name: "Home", id: "/" }, { name: "Services", id: "/services" }, { name: "Gallery", id: "/gallery" }, { name: "Contact", id: "/contact" }]}
brandName="High Rise Roofing"
button={{ text: "Get Quote", href: "/contact" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitDoubleCarousel
background={{ variant: "gradient-bars" }}
title="Built to Last. Crafted to Perfection."
description="Premium roofing solutions with unmatched craftsmanship, honesty, and structural expertise."
leftCarouselItems={[{ imageSrc: "http://img.b2bpic.net/free-photo/modern-country-houses-construction_1385-20.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/residential-house_53876-23089.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/brick-wall-background-texture_1048-16945.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/facade-modern-new-building_23-2147694757.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/modern-country-houses-construction_1385-20.jpg" }]}
rightCarouselItems={[{ imageSrc: "http://img.b2bpic.net/free-photo/brick-wall-background-texture_1048-16945.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/facade-modern-new-building_23-2147694757.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/modern-country-houses-construction_1385-20.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/residential-house_53876-23089.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/brick-wall-background-texture_1048-16945.jpg" }]}
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardOne
animationType="slide-up"
textboxLayout="split-description"
gridVariant="bento-grid"
metrics={[
{ id: "m1", value: "10+", title: "Years Experience", description: "Proven industry expertise", icon: Shield },
{ id: "m2", value: "100%", title: "Insured Work", description: "Full peace of mind", icon: CheckCircle },
{ id: "m3", value: "500+", title: "Satisfied Clients", description: "5-star project history", icon: Star }
]}
title="Unrivaled Trust"
description="We deliver excellence in every square inch."
/>
</div>
<div id="services" data-section="services">
<FeatureCardTwentySix
textboxLayout="default"
useInvertedBackground={true}
features={[
{ title: "Roof Installation", description: "Premium installations built to last.", imageSrc: "http://img.b2bpic.net/free-photo/worker-cuts-steel-profiles-drywall-close-up-selective-focus-preparing-installation-ceiling-profile-system-frame-renovation-repair_166373-1903.jpg", buttonIcon: Zap },
{ title: "Roof Repairs", description: "Permanent fixes for leaks and damage.", imageSrc: "http://img.b2bpic.net/free-photo/i-phrase-embedded-grey-tissue_114579-18369.jpg", buttonIcon: Wrench },
{ title: "Inspections", description: "Uncovering issues before they grow.", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-roofer-working-with-helmet_23-2149343710.jpg", buttonIcon: Search },
{ title: "Flat Roofing", description: "Modern solutions for flat surfaces.", imageSrc: "http://img.b2bpic.net/free-photo/worker-cuts-steel-profiles-drywall-close-up-selective-focus-preparing-installation-ceiling-profile-system-frame-renovation-repair_166373-1903.jpg", buttonIcon: Maximize }
]}
title="Roofing Done Right"
description="From minor repairs to comprehensive structural corrections, we handle it all."
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="High Rise Roofing"
columns={[{ title: "Services", items: [{ label: "Installation", href: "/services" }, { label: "Repairs", href: "/services" }] }, { title: "Company", items: [{ label: "Contact", href: "/contact" }] }]}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}
}

View File

@@ -2,160 +2,50 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import AboutMetric from '@/components/sections/about/AboutMetric';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import { Award, Calendar, Users } from "lucide-react";
export default function LandingPage() {
export default function ServicesPage() {
return (
<ThemeProvider
defaultButtonVariant="hover-bubble"
defaultTextAnimation="reveal-blur"
borderRadius="rounded"
defaultButtonVariant="hover-bubble"
defaultTextAnimation="reveal-blur"
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: "/",
},
{
name: "Services",
id: "/services",
},
{
name: "Gallery",
id: "/gallery",
},
{
name: "Contact",
id: "/contact",
},
]}
brandName="High Rise Roofing"
/>
</div>
<div id="services-body" data-section="services-body">
<ProductCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
products={[
{
id: "p1",
name: "Installation",
price: "Get Quote",
imageSrc: "http://img.b2bpic.net/free-photo/worker-cuts-steel-profiles-drywall-close-up-selective-focus-preparing-installation-ceiling-profile-system-frame-renovation-repair_166373-1903.jpg?_wi=3",
},
{
id: "p2",
name: "Repair",
price: "Get Quote",
imageSrc: "http://img.b2bpic.net/free-photo/i-phrase-embedded-grey-tissue_114579-18369.jpg?_wi=2",
},
{
id: "p3",
name: "Inspection",
price: "Get Quote",
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-roofer-working-with-helmet_23-2149343710.jpg?_wi=2",
},
{
id: "p4",
name: "Flat Roofs",
price: "Get Quote",
imageSrc: "http://img.b2bpic.net/free-photo/worker-cuts-steel-profiles-drywall-close-up-selective-focus-preparing-installation-ceiling-profile-system-frame-renovation-repair_166373-1903.jpg?_wi=4",
},
{
id: "p5",
name: "Skylights",
price: "Get Quote",
imageSrc: "http://img.b2bpic.net/free-photo/i-phrase-embedded-grey-tissue_114579-18369.jpg?_wi=3",
},
{
id: "p6",
name: "Ventilation",
price: "Get Quote",
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-roofer-working-with-helmet_23-2149343710.jpg?_wi=3",
},
]}
title="Comprehensive Roofing Services"
description="Everything your property needs to stay protected and durable."
/>
</div>
<div id="about" data-section="about">
<AboutMetric
useInvertedBackground={false}
title="Our Expertise"
metrics={[
{
icon: Award,
label: "Projects Completed",
value: "800+",
},
{
icon: Users,
label: "Team Members",
value: "25",
},
{
icon: Calendar,
label: "Operating Since",
value: "2014",
},
]}
metricsAnimation="slide-up"
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="High Rise Roofing"
columns={[
{
title: "Services",
items: [
{
label: "Installation",
href: "/services",
},
{
label: "Repairs",
href: "/services",
},
{
label: "Inspections",
href: "/services",
},
],
},
{
title: "Company",
items: [
{
label: "About Us",
href: "/about",
},
{
label: "Our Work",
href: "/gallery",
},
{
label: "Contact",
href: "/contact",
},
],
},
]}
/>
</div>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[{ name: "Home", id: "/" }, { name: "Services", id: "/services" }, { name: "Gallery", id: "/gallery" }, { name: "Contact", id: "/contact" }]}
brandName="High Rise Roofing"
button={{ text: "Get Quote", href: "/contact" }}
/>
</div>
<div id="services-body" data-section="services-body">
<ProductCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
products={[
{ id: "p1", name: "Installation", price: "Get Quote", imageSrc: "http://img.b2bpic.net/free-photo/worker-cuts-steel-profiles-drywall-close-up-selective-focus-preparing-installation-ceiling-profile-system-frame-renovation-repair_166373-1903.jpg" },
{ id: "p2", name: "Repair", price: "Get Quote", imageSrc: "http://img.b2bpic.net/free-photo/i-phrase-embedded-grey-tissue_114579-18369.jpg" },
{ id: "p3", name: "Inspection", price: "Get Quote", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-roofer-working-with-helmet_23-2149343710.jpg" }
]}
title="Services"
description="Premium roofing services."
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard logoText="High Rise Roofing" columns={[]} />
</div>
</ReactLenis>
</ThemeProvider>
);
}
}