182 lines
7.9 KiB
TypeScript
182 lines
7.9 KiB
TypeScript
"use client";
|
|
|
|
import Link from "next/link";
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
|
import BlogCardOne from '@/components/sections/blog/BlogCardOne';
|
|
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
|
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
|
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
|
import { Image, Phone } from 'lucide-react';
|
|
|
|
export default function GalleryPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="hover-bubble"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="pill"
|
|
contentWidth="medium"
|
|
sizing="mediumLarge"
|
|
background="noise"
|
|
cardStyle="subtle-shadow"
|
|
primaryButtonStyle="gradient"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="semibold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleFullscreen
|
|
navItems={[
|
|
{ name: "Home", id: "/" },
|
|
{ name: "Services", id: "/services" },
|
|
{ name: "About", id: "/about" },
|
|
{ name: "Contact", id: "/contact" },
|
|
{ name: "Gallery", id: "/gallery" }
|
|
]}
|
|
brandName="Northstar Roofing"
|
|
bottomLeftText="North Dakota Roofing"
|
|
bottomRightText="(701) 555-0100"
|
|
/>
|
|
</div>
|
|
|
|
<div id="main-gallery" data-section="main-gallery">
|
|
<BlogCardOne
|
|
title="Our Roofing Project Gallery"
|
|
description="Browse our extensive portfolio of completed residential and commercial roofing projects across North Dakota"
|
|
tag="Portfolio"
|
|
tagIcon={Image}
|
|
blogs={[
|
|
{
|
|
id: "1",
|
|
category: "Residential",
|
|
title: "Complete Roof Replacement - Bismarck",
|
|
excerpt: "Full architectural shingle replacement on 2,400 sq ft home with premium materials and lifetime warranty",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/exterior-home_74190-4300.jpg?_wi=3",
|
|
authorName: "Northstar Team",
|
|
authorAvatar: "http://img.b2bpic.net/free-photo/portrait-businessman-office-2_1262-1488.jpg",
|
|
date: "March 2024"
|
|
},
|
|
{
|
|
id: "2",
|
|
category: "Storm Restoration",
|
|
title: "Hail Damage Recovery - Minot",
|
|
excerpt: "Restored severe hail damage with complete insurance coordination and customer satisfaction",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/man-walking-roof_1321-1041.jpg?_wi=2",
|
|
authorName: "Northstar Team",
|
|
authorAvatar: "http://img.b2bpic.net/free-photo/portrait-businessman-office-2_1262-1488.jpg",
|
|
date: "February 2024"
|
|
},
|
|
{
|
|
id: "3",
|
|
category: "Commercial",
|
|
title: "Commercial Flat Roof - Fargo",
|
|
excerpt: "Industrial-grade TPO roofing system for 5,000 sq ft warehouse with 20-year warranty",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/agricultural-silo_146671-19121.jpg?_wi=3",
|
|
authorName: "Northstar Team",
|
|
authorAvatar: "http://img.b2bpic.net/free-photo/portrait-businessman-office-2_1262-1488.jpg",
|
|
date: "January 2024"
|
|
},
|
|
{
|
|
id: "4",
|
|
category: "Residential",
|
|
title: "Metal Roof Installation - Grand Forks",
|
|
excerpt: "Premium standing-seam metal roof for modern farmhouse with energy-efficient design",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/modern-house-architecture-navy-roof-wooden-soffit-blue-sky_626616-509.jpg",
|
|
authorName: "Northstar Team",
|
|
authorAvatar: "http://img.b2bpic.net/free-photo/portrait-businessman-office-2_1262-1488.jpg",
|
|
date: "December 2023"
|
|
},
|
|
{
|
|
id: "5",
|
|
category: "Emergency Repair",
|
|
title: "Emergency Leak Repair - Williston",
|
|
excerpt: "24-hour emergency response to severe wind damage with immediate tarping and permanent repair",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/factory-worker-with-face-mask-feeling-ill-holding-his-head-pain-production-facility_637285-12061.jpg?_wi=2",
|
|
authorName: "Northstar Team",
|
|
authorAvatar: "http://img.b2bpic.net/free-photo/portrait-businessman-office-2_1262-1488.jpg",
|
|
date: "November 2023"
|
|
},
|
|
{
|
|
id: "6",
|
|
category: "Commercial",
|
|
title: "Multi-Building Project - Dickinson",
|
|
excerpt: "Complete roofing system replacement for industrial complex with coordinated scheduling",
|
|
imageSrc: "http://img.b2bpic.net/free-photo/chernobyl-alienation-zone-view-chernobyl-atomic-plant-background-river_627829-11757.jpg?_wi=2",
|
|
authorName: "Northstar Team",
|
|
authorAvatar: "http://img.b2bpic.net/free-photo/portrait-businessman-office-2_1262-1488.jpg",
|
|
date: "October 2023"
|
|
}
|
|
]}
|
|
carouselMode="buttons"
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
buttons={[{ text: "Request Quote for Similar Project", href: "/contact" }]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="project-stats" data-section="project-stats">
|
|
<MetricCardTwo
|
|
title="Project Portfolio Statistics"
|
|
description="Numbers that showcase our experience and expertise"
|
|
tag="Portfolio Stats"
|
|
metrics={[
|
|
{ id: "1", value: "500+", description: "Completed Projects This Year" },
|
|
{ id: "2", value: "99%", description: "Customer Satisfaction Rate" },
|
|
{ id: "3", value: "15M+", description: "Square Feet of Roofing Installed" }
|
|
]}
|
|
gridVariant="uniform-all-items-equal"
|
|
animationType="opacity"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
/>
|
|
</div>
|
|
|
|
<div id="gallery-cta" data-section="gallery-cta">
|
|
<ContactCenter
|
|
tag="Your Project Next"
|
|
tagIcon={Phone}
|
|
title="Ready to Start Your Roofing Project?"
|
|
description="See your property featured in our next gallery showcase. Contact us today for a free estimate and consultation."
|
|
background={{ variant: "sparkles-gradient" }}
|
|
useInvertedBackground={false}
|
|
inputPlaceholder="your@email.com"
|
|
buttonText="Get My Free Quote"
|
|
termsText="Join hundreds of satisfied customers across North Dakota. Your information is secure."
|
|
/>
|
|
</div>
|
|
|
|
<FooterBaseReveal
|
|
columns={[
|
|
{
|
|
title: "Services",
|
|
items: [
|
|
{ label: "Roof Replacement", href: "/services" },
|
|
{ label: "Roof Repair", href: "/services" },
|
|
{ label: "Storm Damage", href: "/services" },
|
|
{ label: "Commercial", href: "/services" }
|
|
]
|
|
},
|
|
{
|
|
title: "Company",
|
|
items: [
|
|
{ label: "About Us", href: "/about" },
|
|
{ label: "Gallery", href: "/gallery" },
|
|
{ label: "Reviews", href: "/reviews" },
|
|
{ label: "Contact", href: "/contact" }
|
|
]
|
|
},
|
|
{
|
|
title: "Contact",
|
|
items: [
|
|
{ label: "Phone: (701) 555-0100", href: "tel:+17015550100" },
|
|
{ label: "Emergency: 24/7 Available", href: "tel:+17015550100" },
|
|
{ label: "Licensed & Insured", href: "#" },
|
|
{ label: "BBB Accredited", href: "#" }
|
|
]
|
|
}
|
|
]}
|
|
copyrightText="© 2025 Northstar Roofing LLC. North Dakota Roofing Specialists. All rights reserved."
|
|
/>
|
|
</ThemeProvider>
|
|
);
|
|
} |