bender/852a1339-fffa-4e15-a4aa-6798de513070
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_1 into main #3

Merged
bender merged 8 commits from version_1 into main 2026-02-27 21:24:55 +00:00
Conversation 0 Commits 8 Files Changed 8 +492 -592
8 changed files with 492 additions and 592 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/app/blog/page.tsx
View File

@@ -1,10 +1,10 @@
"use client";
import ReactLenis from "lenis/react";
import BlogCardThree from '@/components/sections/blog/BlogCardThree';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import BlogCardOne from "@/components/sections/blog/BlogCardOne";
import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
import { useBlogPosts } from "@/hooks/useBlogPosts";
export default function BlogPage() {
@@ -46,16 +46,14 @@ export default function BlogPage() {
</div>
) : (
<div id="blog" data-section="blog">
<BlogCardThree
<BlogCardOne
blogs={posts}
title="Roofing Insights & Updates"
description="Expert advice, industry news, and project highlights from North Dakota's trusted roofing professionals"
tag="Blog"
description="Expert advice, industry updates, and project showcases from Northstar Roofing professionals"
textboxLayout="default"
useInvertedBackground={false}
animationType="slide-up"
carouselMode="buttons"
uniformGridCustomHeightClasses="min-h-[600px]"
animationType="slide-up"
/>
</div>
)}

145
src/app/commercial/page.tsx
View File

@@ -1,12 +1,12 @@
"use client";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
import SplitAbout from '@/components/sections/about/SplitAbout';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import Link from 'next/link';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { Building, Clock, Shield, Users } from "lucide-react";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import SplitAbout from '@/components/sections/about/SplitAbout';
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { Building, Shield, Clock } from 'lucide-react';
export default function CommercialPage() {
return (
@@ -25,63 +25,65 @@ export default function CommercialPage() {
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Home", id: "/" },
{ name: "Residential", id: "/residential" },
{ name: "Commercial", id: "/commercial" },
{ name: "Storm Damage", id: "/storm-damage" },
{ name: "Gallery", id: "/gallery" }
{ name: 'Home', id: '/' },
{ name: 'Residential', id: '/residential' },
{ name: 'Commercial', id: '/commercial' },
{ name: 'Storm Damage', id: '/storm-damage' },
{ name: 'Gallery', id: '/gallery' }
]}
button={{ text: "Get Free Estimate", href: "/contact" }}
button={{
text: 'Get Free Estimate',
href: '/contact'
}}
brandName="Northstar Roofing"
/>
</div>
<div id="hero" data-section="hero">
<HeroSplit
<div id="commercial-hero" data-section="commercial-hero">
<SplitAbout
title="Commercial Roofing Solutions"
description="Large-scale roofing for businesses, warehouses, and industrial facilities across North Dakota. Minimal downtime, maximum protection, professional results."
tag="Enterprise Roofing Specialists"
background={{ variant: "glowing-orb" }}
description="Protecting North Dakota businesses with industrial-grade roofing systems. From warehouses to office buildings, we deliver scalable solutions that minimize operational disruption."
tag="Commercial Services"
tagIcon={Building}
textboxLayout="default"
useInvertedBackground={false}
bulletPoints={[
{
title: "Large-Scale Projects", description: "Specialized equipment and crews for industrial and commercial buildings of any size.", icon: Building
},
{
title: "Minimal Disruption", description: "Coordinated scheduling to keep your business operations running smoothly during installation.", icon: Clock
},
{
title: "Commercial Warranties", description: "Extended warranty options designed specifically for commercial properties and heavy-use environments.", icon: Shield
}
]}
buttons={[
{ text: "Get Commercial Quote", href: "/contact" },
{ text: "View Projects", href: "/gallery" }
{ text: 'Request Commercial Quote', href: '/contact' }
]}
imageSrc="http://img.b2bpic.net/free-photo/agricultural-silo_146671-19121.jpg?_wi=1"
imageAlt="Commercial building with professional roofing"
imageAlt="Large commercial building with professional roofing"
imagePosition="right"
mediaAnimation="slide-up"
tagAnimation="entrance-slide"
/>
</div>
<div id="services" data-section="services">
<div id="commercial-systems" data-section="commercial-systems">
<FeatureCardTwentyFour
title="Commercial Services"
description="Specialized roofing solutions for North Dakota businesses and industrial properties"
title="Commercial Roofing Systems"
description="Industrial-grade solutions for every type of commercial property"
features={[
{
id: "1",
title: "Large-Scale Installations",
author: "Enterprise Solutions",
description: "Complete roofing systems for warehouses, office buildings, and industrial facilities. Coordinated scheduling to minimize business disruption.",
tags: ["Enterprise", "Warehouses", "Office Buildings"],
id: "1", title: "TPO Membrane Systems", author: "Energy Efficient", description: "Single-ply thermoplastic membrane roofing with excellent energy efficiency and durability for flat and low-slope roofs.", tags: ["Energy Efficient", "Durable", "Low Maintenance"],
imageSrc: "http://img.b2bpic.net/free-photo/agricultural-silo_146671-19121.jpg?_wi=2"
},
{
id: "2",
title: "Maintenance Programs",
author: "Preventive Care",
description: "Scheduled maintenance and inspection programs. Keep your commercial roof in optimal condition with regular professional care.",
tags: ["Preventive", "Inspections", "Scheduled"],
imageSrc: "http://img.b2bpic.net/free-photo/engineer-writing-condenser-values_482257-90848.jpg"
id: "2", title: "Modified Bitumen", author: "Heavy Duty", description: "Multi-layer roofing system ideal for high-traffic commercial roofs. Excellent waterproofing and weather resistance.", tags: ["Heavy Duty", "Waterproof", "Weather Resistant"],
imageSrc: "http://img.b2bpic.net/free-photo/old-rusty-metallic-surface_23-2148846057.jpg?_wi=2"
},
{
id: "3",
title: "Emergency Repairs",
author: "24/7 Response",
description: "Rapid response for storm damage, leaks, and structural issues. Minimize business interruption with fast, professional emergency services.",
tags: ["Emergency", "24/7", "Fast Response"],
imageSrc: "http://img.b2bpic.net/free-photo/old-rusty-metallic-surface_23-2148846057.jpg?_wi=2"
id: "3", title: "Metal Roofing", author: "Long Lasting", description: "Standing seam and corrugated metal systems for industrial buildings. Superior longevity and weather protection.", tags: ["Longevity", "Industrial", "Weather Protection"],
imageSrc: "http://img.b2bpic.net/free-photo/construction-worker-using-hammer-job-site_23-2150530695.jpg?_wi=3"
}
]}
animationType="slide-up"
@@ -92,36 +94,27 @@ export default function CommercialPage() {
<div id="commercial-advantages" data-section="commercial-advantages">
<SplitAbout
title="Why Businesses Choose Northstar"
description="Specialized expertise in commercial roofing with a focus on efficiency, quality, and minimal business disruption."
tag="Business-Focused Service"
title="Why Choose Northstar for Commercial Projects"
description="Our commercial roofing expertise ensures your business investment is protected with professional-grade materials and installation."
tag="Commercial Expertise"
textboxLayout="default"
useInvertedBackground={true}
bulletPoints={[
{
title: "Minimal Downtime",
description: "Coordinated scheduling and efficient execution to keep your business operations running smoothly during roofing projects.",
icon: Clock
title: "Licensed & Bonded", description: "Full commercial licensing and bonding for large-scale projects. Your investment is fully protected.", icon: Shield
},
{
title: "Enterprise Experience",
description: "Extensive experience with large-scale commercial projects, multi-building complexes, and industrial facilities.",
icon: Building
title: "Flexible Scheduling", description: "Weekend and off-hours installation available to minimize disruption to your business operations.", icon: Clock
},
{
title: "Commercial Insurance",
description: "Full commercial liability coverage and bonding. Your business and property are completely protected throughout the project.",
icon: Shield
},
{
title: "Project Management",
description: "Dedicated project managers ensure clear communication, timeline adherence, and seamless coordination with your team.",
icon: Users
title: "Maintenance Programs", description: "Ongoing maintenance and inspection programs to extend roof life and prevent costly repairs.", icon: Building
}
]}
buttons={[{ text: "Request Commercial Quote", href: "/contact" }]}
buttons={[
{ text: 'Schedule Commercial Consultation', href: '/contact' }
]}
imageSrc="http://img.b2bpic.net/free-photo/three-men-looking-aside-construction-site_259150-57679.jpg?_wi=2"
imageAlt="Commercial roofing team on project site"
imageAlt="Commercial roofing team and equipment"
imagePosition="left"
mediaAnimation="slide-up"
/>
@@ -133,34 +126,34 @@ export default function CommercialPage() {
columns={[
{
items: [
{ label: "Home", href: "/" },
{ label: "Residential Roofing", href: "/residential" },
{ label: "Commercial Roofing", href: "/commercial" },
{ label: "Storm Damage", href: "/storm-damage" }
{ label: 'Home', href: '/' },
{ label: 'Residential Roofing', href: '/residential' },
{ label: 'Commercial Roofing', href: '/commercial' },
{ label: 'Storm Damage', href: '/storm-damage' }
]
},
{
items: [
{ label: "About Us", href: "/about" },
{ label: "Project Gallery", href: "/gallery" },
{ label: "Customer Reviews", href: "/reviews" },
{ label: "Contact Us", href: "/contact" }
{ label: 'About Us', href: '/about' },
{ label: 'Project Gallery', href: '/gallery' },
{ label: 'Customer Reviews', href: '/reviews' },
{ label: 'Contact Us', href: '/contact' }
]
},
{
items: [
{ label: "Licensed & Insured", href: "#" },
{ label: "Warranty Information", href: "#" },
{ label: "Privacy Policy", href: "#" },
{ label: "Terms of Service", href: "#" }
{ label: 'Licensed & Insured' },
{ label: 'Warranty Information' },
{ label: 'Privacy Policy' },
{ label: 'Terms of Service' }
]
},
{
items: [
{ label: "Emergency Service", href: "tel:+1-701-555-0100" },
{ label: "701-555-0100", href: "tel:+1-701-555-0100" },
{ label: "Monday - Friday: 8AM - 6PM", href: "#" },
{ label: "24/7 Emergency Hotline", href: "tel:+1-701-555-0101" }
{ label: 'Emergency Service', href: 'tel:+1-701-555-0100' },
{ label: '701-555-0100', href: 'tel:+1-701-555-0100' },
{ label: 'Monday - Friday: 8AM - 6PM' },
{ label: '24/7 Emergency Hotline', href: 'tel:+1-701-555-0101' }
]
}
]}

151
src/app/contact/page.tsx
View File

@@ -1,11 +1,12 @@
"use client";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import ContactText from '@/components/sections/contact/ContactText';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import Link from 'next/link';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import ContactText from '@/components/sections/contact/ContactText';
import SplitAbout from '@/components/sections/about/SplitAbout';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { Phone, Clock, MapPin } from 'lucide-react';
export default function ContactPage() {
return (
@@ -24,78 +25,86 @@ export default function ContactPage() {
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Home", id: "/" },
{ name: "Residential", id: "/residential" },
{ name: "Commercial", id: "/commercial" },
{ name: "Storm Damage", id: "/storm-damage" },
{ name: "Gallery", id: "/gallery" }
{ name: 'Home', id: '/' },
{ name: 'Residential', id: '/residential' },
{ name: 'Commercial', id: '/commercial' },
{ name: 'Storm Damage', id: '/storm-damage' },
{ name: 'Gallery', id: '/gallery' }
]}
button={{ text: "Get Free Estimate", href: "/contact" }}
button={{
text: 'Get Free Estimate',
href: '/contact'
}}
brandName="Northstar Roofing"
/>
</div>
<div id="hero" data-section="hero">
<HeroSplit
title="Get Your Free Roofing Estimate"
description="Ready to protect your property? Contact Northstar Roofing for a free, no-obligation estimate. Licensed, insured, and ready to serve North Dakota."
tag="Free Estimates • Fast Response • Licensed & Insured"
background={{ variant: "glowing-orb" }}
<div id="contact-cta" data-section="contact-cta">
<ContactText
text="Ready to protect your property? Get a free roof estimate in 24 hours. No obligation. No pressure. Just honest expertise."
animationType="entrance-slide"
buttons={[
{ text: "Call Now", href: "tel:+1-701-555-0100" },
{ text: "Emergency Service", href: "tel:+1-701-555-0101" }
{ text: 'Get Free Estimate', href: 'tel:+1-701-555-0100' },
{ text: 'Call: 701-555-0100', href: 'tel:+1-701-555-0100' }
]}
imageSrc: "http://img.b2bpic.net/free-photo/three-men-looking-aside-construction-site_259150-57679.jpg?_wi=4"
imageAlt: "Northstar Roofing professional team"
imagePosition: "right"
mediaAnimation: "slide-up"
tagAnimation: "entrance-slide"
background={{ variant: 'plain' }}
useInvertedBackground={false}
/>
</div>
<div id="contact-info" data-section="contact-info">
<MetricCardTwo
title="Contact Information"
description="Get in touch with North Dakota's trusted roofing experts"
metrics={[
<SplitAbout
title="Get In Touch With Northstar Roofing"
description="Contact us today for your free roofing consultation. Our team is ready to help with all your roofing needs across North Dakota."
tag="Contact Information"
textboxLayout="default"
useInvertedBackground={true}
bulletPoints={[
{
id: "1",
value: "701-555-0100",
description: "Main Office Line"
title: "Call Us Today", description: "701-555-0100 for immediate assistance. 24/7 emergency hotline: 701-555-0101", icon: Phone
},
{
id: "2",
value: "701-555-0101",
description: "24/7 Emergency Hotline"
title: "Business Hours", description: "Monday - Friday: 8AM - 6PM. Weekend appointments available upon request.", icon: Clock
},
{
id: "3",
value: "8AM - 6PM",
description: "Monday through Friday"
},
{
id: "4",
value: "24/7",
description: "Emergency Service Available"
title: "Service Areas", description: "Proudly serving Bismarck, Fargo, Grand Forks, Minot, and surrounding North Dakota communities.", icon: MapPin
}
]}
gridVariant="uniform-all-items-equal"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
buttons={[
{ text: 'Schedule Free Estimate', href: 'tel:+1-701-555-0100' }
]}
imageSrc="http://img.b2bpic.net/free-photo/three-men-looking-aside-construction-site_259150-57679.jpg?_wi=5"
imageAlt="Northstar Roofing team ready to help"
imagePosition="right"
mediaAnimation="slide-up"
/>
</div>
<div id="final-cta" data-section="final-cta">
<ContactText
text="Don't wait for roof problems to get worse. Contact Northstar Roofing today for fast, professional service and peace of mind protection."
animationType="entrance-slide"
buttons={[
{ text: "Call: 701-555-0100", href: "tel:+1-701-555-0100" },
{ text: "Emergency: 701-555-0101", href: "tel:+1-701-555-0101" }
]}
background={{ variant: "plain" }}
<div id="emergency-contact" data-section="emergency-contact">
<SplitAbout
title="Emergency Roofing Services"
description="Storm damage? Leaking roof? Don't wait. Our emergency response team is available 24/7 to protect your property and prevent further damage."
tag="Emergency Services"
textboxLayout="default"
useInvertedBackground={false}
bulletPoints={[
{
title: "24/7 Emergency Response", description: "Call our emergency hotline anytime for urgent roofing issues and storm damage.", icon: Phone
},
{
title: "Rapid Response Team", description: "Emergency crews dispatched within hours for temporary repairs and damage assessment.", icon: Clock
},
{
title: "Insurance Assistance", description: "Immediate documentation and insurance claim support for storm damage emergencies.", icon: MapPin
}
]}
buttons={[
{ text: 'Emergency Hotline: 701-555-0101', href: 'tel:+1-701-555-0101' }
]}
imageSrc="http://img.b2bpic.net/free-photo/close-up-businessman-standing-front-table-writing-diary-with-pen_23-2148087135.jpg?_wi=3"
imageAlt="Emergency roofing assessment and documentation"
imagePosition="left"
mediaAnimation="slide-up"
/>
</div>
@@ -105,34 +114,34 @@ export default function ContactPage() {
columns={[
{
items: [
{ label: "Home", href: "/" },
{ label: "Residential Roofing", href: "/residential" },
{ label: "Commercial Roofing", href: "/commercial" },
{ label: "Storm Damage", href: "/storm-damage" }
{ label: 'Home', href: '/' },
{ label: 'Residential Roofing', href: '/residential' },
{ label: 'Commercial Roofing', href: '/commercial' },
{ label: 'Storm Damage', href: '/storm-damage' }
]
},
{
items: [
{ label: "About Us", href: "/about" },
{ label: "Project Gallery", href: "/gallery" },
{ label: "Customer Reviews", href: "/reviews" },
{ label: "Contact Us", href: "/contact" }
{ label: 'About Us', href: '/about' },
{ label: 'Project Gallery', href: '/gallery' },
{ label: 'Customer Reviews', href: '/reviews' },
{ label: 'Contact Us', href: '/contact' }
]
},
{
items: [
{ label: "Licensed & Insured", href: "#" },
{ label: "Warranty Information", href: "#" },
{ label: "Privacy Policy", href: "#" },
{ label: "Terms of Service", href: "#" }
{ label: 'Licensed & Insured' },
{ label: 'Warranty Information' },
{ label: 'Privacy Policy' },
{ label: 'Terms of Service' }
]
},
{
items: [
{ label: "Emergency Service", href: "tel:+1-701-555-0100" },
{ label: "701-555-0100", href: "tel:+1-701-555-0100" },
{ label: "Monday - Friday: 8AM - 6PM", href: "#" },
{ label: "24/7 Emergency Hotline", href: "tel:+1-701-555-0101" }
{ label: 'Emergency Service', href: 'tel:+1-701-555-0100' },
{ label: '701-555-0100', href: 'tel:+1-701-555-0100' },
{ label: 'Monday - Friday: 8AM - 6PM' },
{ label: '24/7 Emergency Hotline', href: 'tel:+1-701-555-0101' }
]
}
]}

180
src/app/gallery/page.tsx
View File

@@ -1,11 +1,12 @@
"use client";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import BlogCardThree from '@/components/sections/blog/BlogCardThree';
import ContactText from '@/components/sections/contact/ContactText';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import Link from 'next/link';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import BlogCardThree from '@/components/sections/blog/BlogCardThree';
import SplitAbout from '@/components/sections/about/SplitAbout';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { Camera, CheckCircle, Award } from 'lucide-react';
export default function GalleryPage() {
return (
@@ -24,80 +25,37 @@ export default function GalleryPage() {
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Home", id: "/" },
{ name: "Residential", id: "/residential" },
{ name: "Commercial", id: "/commercial" },
{ name: "Storm Damage", id: "/storm-damage" },
{ name: "Gallery", id: "/gallery" }
{ name: 'Home', id: '/' },
{ name: 'Residential', id: '/residential' },
{ name: 'Commercial', id: '/commercial' },
{ name: 'Storm Damage', id: '/storm-damage' },
{ name: 'Gallery', id: '/gallery' }
]}
button={{ text: "Get Free Estimate", href: "/contact" }}
button={{
text: 'Get Free Estimate',
href: '/contact'
}}
brandName="Northstar Roofing"
/>
</div>
<div id="hero" data-section="hero">
<HeroSplit
title="Project Gallery"
description="See the quality and craftsmanship of our completed roofing projects across North Dakota. From residential homes to commercial buildings."
tag="Before & After Transformations"
background={{ variant: "glowing-orb" }}
buttons={[
{ text: "Start Your Project", href: "/contact" },
{ text: "View All Projects", href: "#projects" }
]}
imageSrc="http://img.b2bpic.net/free-photo/beautiful-house-with-chimney-blue-sky_23-2149627194.jpg?_wi=2"
imageAlt="Completed roofing project showcase"
imagePosition="right"
mediaAnimation="slide-up"
tagAnimation="entrance-slide"
/>
</div>
<div id="projects" data-section="projects">
<div id="gallery" data-section="gallery">
<BlogCardThree
title="Recent Projects"
description="Explore our completed roofing projects across North Dakota"
tag="Portfolio"
title="Before & After Gallery"
description="See the transformation of roofing projects across North Dakota"
tag="Project Gallery"
blogs={[
{
id: "1",
category: "Residential Replacement",
title: "Bismarck Home - Complete Roof Replacement",
excerpt: "Full roof replacement on 2000 sq ft home. New architectural shingles with upgraded underlayment. 2-day installation.",
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-house-with-chimney-blue-sky_23-2149627194.jpg?_wi=3",
authorName: "Northstar Team",
authorAvatar: "http://img.b2bpic.net/free-photo/happy-builder-hardhat_1398-1726.jpg",
date: "Jan 2025"
id: "1", category: "Residential Replacement", title: "Bismarck Home - Complete Roof Replacement", excerpt: "Full roof replacement on 2000 sq ft home. New architectural shingles with upgraded underlayment. 2-day installation.", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-house-with-chimney-blue-sky_23-2149627194.jpg?_wi=2", imageAlt: "Bismarck home roof replacement", authorName: "Northstar Team", authorAvatar: "http://img.b2bpic.net/free-photo/happy-builder-hardhat_1398-1726.jpg", date: "Jan 2025"
},
{
id: "2",
category: "Storm Damage Repair",
title: "Minot Property - Hail Damage Restoration",
excerpt: "Severe hail damage on commercial building. Insurance-approved restoration with reinforced shingles and protective coating.",
imageSrc: "http://img.b2bpic.net/free-photo/auto-mechanic-inflating-tire-with-air-compressor-street_651396-3561.jpg",
authorName: "Northstar Team",
authorAvatar: "http://img.b2bpic.net/free-photo/portrait-manual-worker-warehouse_329181-12798.jpg",
date: "Dec 2024"
id: "2", category: "Storm Damage Repair", title: "Minot Property - Hail Damage Restoration", excerpt: "Severe hail damage on commercial building. Insurance-approved restoration with reinforced shingles and protective coating.", imageSrc: "http://img.b2bpic.net/free-photo/auto-mechanic-inflating-tire-with-air-compressor-street_651396-3561.jpg", imageAlt: "Minot commercial hail damage repair", authorName: "Northstar Team", authorAvatar: "http://img.b2bpic.net/free-photo/portrait-manual-worker-warehouse_329181-12798.jpg", date: "Dec 2024"
},
{
id: "3",
category: "Commercial Project",
title: "Grand Forks Business Complex",
excerpt: "Multi-building commercial roofing project. Coordinated installation with minimal operational disruption.",
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-worker-factory_107420-96555.jpg",
date: "Nov 2024"
id: "3", category: "Commercial Project", title: "Grand Forks Business Complex - Large-Scale Install", excerpt: "Multi-building commercial roofing project. Coordinated installation with minimal operational disruption.", imageSrc: "http://img.b2bpic.net/free-photo/agricultural-silo_146671-19121.jpg?_wi=3", imageAlt: "Grand Forks commercial roofing project", authorName: "Northstar Team", authorAvatar: "http://img.b2bpic.net/free-photo/portrait-worker-factory_107420-96555.jpg", date: "Nov 2024"
},
{
id: "4",
category: "Emergency Repair",
title: "Fargo Home - Wind Damage Emergency Repair",
excerpt: "24-hour emergency response to severe wind damage. Temporary and permanent solutions completed same week.",
imageSrc: "http://img.b2bpic.net/free-photo/homemade-house_1361-130.jpg",
authorName: "Northstar Team",
authorAvatar: "http://img.b2bpic.net/free-photo/portrait-manual-worker-warehouse_329181-12798.jpg",
date: "Oct 2024"
id: "4", category: "Emergency Repair", title: "Fargo Home - Wind Damage Emergency Repair", excerpt: "24-hour emergency response to severe wind damage. Temporary and permanent solutions same week.", imageSrc: "http://img.b2bpic.net/free-photo/homemade-house_1361-130.jpg?_wi=2", imageAlt: "Fargo emergency wind damage repair", authorName: "Northstar Team", authorAvatar: "http://img.b2bpic.net/free-photo/portrait-manual-worker-warehouse_329181-12798.jpg", date: "Oct 2024"
}
]}
animationType="slide-up"
@@ -106,16 +64,60 @@ export default function GalleryPage() {
/>
</div>
<div id="get-quote" data-section="get-quote">
<ContactText
text="Ready to start your roofing project? See your property transformed with professional Northstar quality. Get a free estimate today."
animationType="entrance-slide"
buttons={[
{ text: "Get Free Estimate", href: "/contact" },
{ text: "Call: 701-555-0100", href: "tel:+1-701-555-0100" }
<div id="quality-showcase" data-section="quality-showcase">
<SplitAbout
title="Quality You Can See"
description="Every project in our gallery represents our commitment to superior craftsmanship and customer satisfaction. From residential homes to commercial complexes, see why North Dakota trusts Northstar Roofing."
tag="Our Work"
tagIcon={Camera}
textboxLayout="default"
useInvertedBackground={true}
bulletPoints={[
{
title: "Professional Photography", description: "Every completed project is professionally documented to showcase our attention to detail and quality results.", icon: Camera
},
{
title: "Quality Assurance", description: "Each project undergoes rigorous quality inspection before completion. Your satisfaction is our guarantee.", icon: CheckCircle
},
{
title: "Award-Winning Results", description: "Our gallery showcases award-winning roofing projects recognized for excellence in North Dakota.", icon: Award
}
]}
background={{ variant: "plain" }}
buttons={[
{ text: 'Start Your Project', href: '/contact' }
]}
imageSrc="http://img.b2bpic.net/free-photo/three-men-looking-aside-construction-site_259150-57679.jpg?_wi=4"
imageAlt="Professional roofing team at completed project"
imagePosition="right"
mediaAnimation="slide-up"
/>
</div>
<div id="project-features" data-section="project-features">
<SplitAbout
title="What Makes Our Projects Stand Out"
description="See the difference that professional expertise and premium materials make in every Northstar Roofing project."
tag="Project Excellence"
textboxLayout="default"
useInvertedBackground={false}
bulletPoints={[
{
title: "Premium Materials Only", description: "We use only the highest grade materials from trusted manufacturers with comprehensive warranties.", icon: Award
},
{
title: "Clean Installation", description: "Professional job sites with daily cleanup and protection of your property throughout the project.", icon: CheckCircle
},
{
title: "Detailed Documentation", description: "Complete before and after documentation for your records and peace of mind.", icon: Camera
}
]}
buttons={[
{ text: 'View More Projects', href: '/contact' }
]}
imageSrc="http://img.b2bpic.net/free-photo/beautiful-house-with-chimney-blue-sky_23-2149627194.jpg?_wi=3"
imageAlt="Completed roofing project showing quality results"
imagePosition="left"
mediaAnimation="slide-up"
/>
</div>
@@ -125,34 +127,34 @@ export default function GalleryPage() {
columns={[
{
items: [
{ label: "Home", href: "/" },
{ label: "Residential Roofing", href: "/residential" },
{ label: "Commercial Roofing", href: "/commercial" },
{ label: "Storm Damage", href: "/storm-damage" }
{ label: 'Home', href: '/' },
{ label: 'Residential Roofing', href: '/residential' },
{ label: 'Commercial Roofing', href: '/commercial' },
{ label: 'Storm Damage', href: '/storm-damage' }
]
},
{
items: [
{ label: "About Us", href: "/about" },
{ label: "Project Gallery", href: "/gallery" },
{ label: "Customer Reviews", href: "/reviews" },
{ label: "Contact Us", href: "/contact" }
{ label: 'About Us', href: '/about' },
{ label: 'Project Gallery', href: '/gallery' },
{ label: 'Customer Reviews', href: '/reviews' },
{ label: 'Contact Us', href: '/contact' }
]
},
{
items: [
{ label: "Licensed & Insured", href: "#" },
{ label: "Warranty Information", href: "#" },
{ label: "Privacy Policy", href: "#" },
{ label: "Terms of Service", href: "#" }
{ label: 'Licensed & Insured' },
{ label: 'Warranty Information' },
{ label: 'Privacy Policy' },
{ label: 'Terms of Service' }
]
},
{
items: [
{ label: "Emergency Service", href: "tel:+1-701-555-0100" },
{ label: "701-555-0100", href: "tel:+1-701-555-0100" },
{ label: "Monday - Friday: 8AM - 6PM", href: "#" },
{ label: "24/7 Emergency Hotline", href: "tel:+1-701-555-0101" }
{ label: 'Emergency Service', href: 'tel:+1-701-555-0100' },
{ label: '701-555-0100', href: 'tel:+1-701-555-0100' },
{ label: 'Monday - Friday: 8AM - 6PM' },
{ label: '24/7 Emergency Hotline', href: 'tel:+1-701-555-0101' }
]
}
]}

23
src/app/layout.tsx
View File

@@ -5,36 +5,23 @@ import { ServiceWrapper } from "@/components/ServiceWrapper";
import Tag from "@/tag/Tag";
const workSans = Work_Sans({
variable: "--font-work-sans",
subsets: ["latin"],
variable: "--font-work-sans", subsets: ["latin"],
});
export const metadata: Metadata = {
title: "Northstar Roofing LLC | North Dakota Roofing Company",
description: "Licensed, insured North Dakota roofing company specializing in residential & commercial roofing, storm damage restoration, and hail repairs with lifetime warranties.",
keywords: "North Dakota roofing company, roof repair ND, roof replacement, hail damage, storm restoration, commercial roofing, Bismarck, Fargo, Grand Forks",
metadataBase: new URL("https://northstarroofing.nd"),
title: "Northstar Roofing LLC | North Dakota Roofing Company", description: "Licensed, insured North Dakota roofing company specializing in residential & commercial roofing, storm damage restoration, and hail repairs with lifetime warranties.", keywords: "North Dakota roofing company, roof repair ND, roof replacement, hail damage, storm restoration, commercial roofing, Bismarck, Fargo, Grand Forks", metadataBase: new URL("https://northstarroofing.nd"),
alternates: {
canonical: "https://northstarroofing.nd"
},
openGraph: {
title: "Northstar Roofing LLC | North Dakota Roofing",
description: "Trusted roofing solutions for ND homes and businesses. Licensed, insured, warranty-backed. Free estimates.",
url: "https://northstarroofing.nd",
siteName: "Northstar Roofing LLC",
type: "website",
images: [
title: "Northstar Roofing LLC | North Dakota Roofing", description: "Trusted roofing solutions for ND homes and businesses. Licensed, insured, warranty-backed. Free estimates.", url: "https://northstarroofing.nd", siteName: "Northstar Roofing LLC", type: "website", images: [
{
url: "http://img.b2bpic.net/free-photo/houses-surrounded-by-trees-covered-snow-larvik-norway_181624-11854.jpg",
alt: "Professional North Dakota roofing services"
url: "http://img.b2bpic.net/free-photo/houses-surrounded-by-trees-covered-snow-larvik-norway_181624-11854.jpg", alt: "Professional North Dakota roofing services"
}
]
},
twitter: {
card: "summary_large_image",
title: "Northstar Roofing LLC",
description: "North Dakota's trusted roofing experts. Residential & commercial. Storm damage specialists.",
images: ["http://img.b2bpic.net/free-photo/houses-surrounded-by-trees-covered-snow-larvik-norway_181624-11854.jpg"]
card: "summary_large_image", title: "Northstar Roofing LLC", description: "North Dakota's trusted roofing experts. Residential & commercial. Storm damage specialists.", images: ["http://img.b2bpic.net/free-photo/houses-surrounded-by-trees-covered-snow-larvik-norway_181624-11854.jpg"]
},
robots: {
index: true,

220
src/app/page.tsx
View File

@@ -1,15 +1,16 @@
"use client";
import Link from 'next/link';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
import SplitAbout from '@/components/sections/about/SplitAbout';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import ContactText from '@/components/sections/contact/ContactText';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { CloudLightning, CheckCircle, FileText, Zap, Shield, Hammer, MessageSquare, Sparkles, Award, MapPin, Star } from "lucide-react";
import { Star, CloudLightning } from 'lucide-react';
export default function HomePage() {
return (
@@ -28,13 +29,16 @@ export default function HomePage() {
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Home", id: "/" },
{ name: "Residential", id: "/residential" },
{ name: "Commercial", id: "/commercial" },
{ name: "Storm Damage", id: "/storm-damage" },
{ name: "Gallery", id: "/gallery" }
{ name: 'Home', id: '/' },
{ name: 'Residential', id: '/residential' },
{ name: 'Commercial', id: '/commercial' },
{ name: 'Storm Damage', id: '/storm-damage' },
{ name: 'Gallery', id: '/gallery' }
]}
button={{ text: "Get Free Estimate", href: "/contact" }}
button={{
text: 'Get Free Estimate',
href: '/contact'
}}
brandName="Northstar Roofing"
/>
</div>
@@ -44,16 +48,16 @@ export default function HomePage() {
title="North Dakota Roofing Built for Real Weather"
description="Residential and commercial roofing, repairs, and storm restoration. Fast estimates. Clean installs. Strong warranties. Licensed, insured, and storm damage specialists serving North Dakota."
tag="Licensed & Insured • Warranty-Backed • Storm Specialists"
background={{ variant: "glowing-orb" }}
tagAnimation="entrance-slide"
background={{ variant: 'glowing-orb' }}
buttons={[
{ text: "Get Free Estimate", href: "/contact" },
{ text: "Call Now", href: "tel:+1-701-555-0100" }
{ text: 'Get Free Estimate', href: '/contact' },
{ text: 'Call Now', href: 'tel:+1-701-555-0100' }
]}
imageSrc="http://img.b2bpic.net/free-photo/houses-surrounded-by-trees-covered-snow-larvik-norway_181624-11854.jpg"
imageSrc="http://img.b2bpic.net/free-photo/houses-surrounded-by-trees-covered-snow-larvik-norway_181624-11854.jpg?_wi=1"
imageAlt="Modern roofline against North Dakota winter sky"
imagePosition="right"
mediaAnimation="slide-up"
tagAnimation="entrance-slide"
/>
</div>
@@ -64,14 +68,8 @@ export default function HomePage() {
tag="Customer Reviews"
textboxLayout="default"
useInvertedBackground={false}
logos={[
"http://img.b2bpic.net/free-vector/star-rating-with-two-different-backgrounds_1017-6190.jpg",
"http://img.b2bpic.net/free-vector/social-media-logo-collection_23-2148061324.jpg",
"http://img.b2bpic.net/free-vector/labor-day-badges-collection-flat-style_23-2147864471.jpg",
"http://img.b2bpic.net/free-vector/flat-design-eleicoes-2020-background_23-2148699148.jpg",
"http://img.b2bpic.net/free-vector/real-estate-open-house-label_23-2148479337.jpg",
"http://img.b2bpic.net/free-photo/approved-authentic-quality-guaranteed-product-concept_53876-13748.jpg",
"http://img.b2bpic.net/free-vector/rate-remark-us-business-background-client-feedback-opinion-matter_1017-60953.jpg"
names={[
"Premium Quality Reviews", "Professional Social Media Presence", "Industry Recognition Awards", "Top Rated Contractor", "Licensed Property Experts", "Certified Quality Assurance", "Customer Satisfaction Leader"
]}
speed={35}
showCard={true}
@@ -84,27 +82,15 @@ export default function HomePage() {
description="Complete solutions for residential and commercial properties across North Dakota"
features={[
{
id: "1",
title: "Roof Replacement",
author: "Full Coverage Solutions",
description: "Complete roof replacement with premium materials. New shingles, underlayment, and structural inspection. Warranty-backed workmanship.",
tags: ["Residential", "Commercial", "Warranty"],
id: "1", title: "Roof Replacement", author: "Full Coverage Solutions", description: "Complete roof replacement with premium materials. New shingles, underlayment, and structural inspection. Warranty-backed workmanship.", tags: ["Residential", "Commercial", "Warranty"],
imageSrc: "http://img.b2bpic.net/free-photo/construction-worker-using-hammer-job-site_23-2150530695.jpg?_wi=1"
},
{
id: "2",
title: "Roof Repair & Maintenance",
author: "Fast Response Team",
description: "Quick repairs for leaks, damaged shingles, flashing, and ventilation. Emergency storm damage repairs available 24/7.",
tags: ["Emergency", "Fast Service", "Affordable"],
imageSrc: "http://img.b2bpic.net/free-photo/construction-worker-using-hammer-job-site_23-2150530689.jpg?_wi=1"
id: "2", title: "Roof Repair & Maintenance", author: "Fast Response Team", description: "Quick repairs for leaks, damaged shingles, flashing, and ventilation. Emergency storm damage repairs available 24/7.", tags: ["Emergency", "Fast Service", "Affordable"],
imageSrc: "http://img.b2bpic.net/free-photo/construction-worker-using-hammer-job-site_23-2150530689.jpg"
},
{
id: "3",
title: "Storm Damage Restoration",
author: "Insurance Claims Experts",
description: "Hail, wind, and ice damage assessment and restoration. We handle insurance paperwork and documentation for faster claims processing.",
tags: ["Insurance", "Hail Damage", "Documentation"],
id: "3", title: "Storm Damage Restoration", author: "Insurance Claims Experts", description: "Hail, wind, and ice damage assessment and restoration. We handle insurance paperwork and documentation for faster claims processing.", tags: ["Insurance", "Hail Damage", "Documentation"],
imageSrc: "http://img.b2bpic.net/free-photo/old-rusty-metallic-surface_23-2148846057.jpg?_wi=1"
}
]}
@@ -114,85 +100,6 @@ export default function HomePage() {
/>
</div>
<div id="storm-damage" data-section="storm-damage">
<SplitAbout
title="Storm Damage? We're Here to Help"
description="Hail, wind, and ice damage? Our expert team handles the entire process from inspection to insurance claim support to final installation. Get your roof restored quickly and properly."
tag="Storm Response"
tagIcon={CloudLightning}
textboxLayout="default"
useInvertedBackground={true}
bulletPoints={[
{
title: "Free Storm Inspection",
description: "Same-day inspections available. Detailed damage assessment and photo documentation for your insurance claim.",
icon: CheckCircle
},
{
title: "Insurance Claim Support",
description: "We work directly with your insurance company. Professional documentation ensures faster claim approval and maximum coverage.",
icon: FileText
},
{
title: "Quick Response Time",
description: "24/7 emergency availability. Most urgent repairs completed within 24-48 hours to prevent further water damage.",
icon: Zap
},
{
title: "Licensed & Bonded",
description: "Full North Dakota licensing and bonding. Your protection and peace of mind guaranteed on every project.",
icon: Shield
}
]}
buttons={[{ text: "Book Storm Inspection", href: "/contact" }]}
imageSrc="http://img.b2bpic.net/free-photo/close-up-businessman-standing-front-table-writing-diary-with-pen_23-2148087135.jpg?_wi=1"
imageAlt="Storm damage inspection and assessment"
imagePosition="right"
mediaAnimation="slide-up"
/>
</div>
<div id="why-northstar" data-section="why-northstar">
<SplitAbout
title="Why Choose Northstar Roofing?"
description="Over 15 years of trusted roofing experience serving North Dakota families and businesses with unmatched craftsmanship and reliability."
tag="Local ND Team"
textboxLayout="default"
useInvertedBackground={false}
bulletPoints={[
{
title: "Expert Craftsmanship",
description: "Every roof installed with precision and attention to detail. Quality materials combined with skilled workmanship.",
icon: Hammer
},
{
title: "Clear Communication",
description: "You're always informed. Regular updates, honest pricing, and transparent project timelines from start to finish.",
icon: MessageSquare
},
{
title: "Clean Job Sites",
description: "Professional work environment. We protect your property and leave job sites spotless every single time.",
icon: Sparkles
},
{
title: "Lifetime Warranty",
description: "Comprehensive warranty on labor and materials. Your investment is protected for years to come.",
icon: Award
},
{
title: "Local North Dakota Team",
description: "Proud local business. We understand ND weather, building codes, and the needs of our neighbors.",
icon: MapPin
}
]}
imageSrc="http://img.b2bpic.net/free-photo/three-men-looking-aside-construction-site_259150-57679.jpg?_wi=1"
imageAlt="Northstar Roofing professional team"
imagePosition="left"
mediaAnimation="slide-up"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwelve
cardTitle="Over 500 North Dakota families and businesses trust Northstar Roofing for their roofing needs"
@@ -202,38 +109,55 @@ export default function HomePage() {
useInvertedBackground={false}
testimonials={[
{
id: "1",
name: "Sarah Johnson",
imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg"
id: "1", name: "Sarah Johnson", imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg?_wi=1"
},
{
id: "2",
name: "Michael Chen",
imageSrc: "http://img.b2bpic.net/free-photo/smiling-businessman-standing-airport_107420-85035.jpg"
id: "2", name: "Michael Chen", imageSrc: "http://img.b2bpic.net/free-photo/smiling-businessman-standing-airport_107420-85035.jpg"
},
{
id: "3",
name: "Emily Rodriguez",
imageSrc: "http://img.b2bpic.net/free-photo/front-view-lawyer-portrait_23-2151202433.jpg"
id: "3", name: "Emily Rodriguez", imageSrc: "http://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg?_wi=2"
},
{
id: "4",
name: "David Kim",
imageSrc: "http://img.b2bpic.net/free-photo/alone-specialist-handsome-daydreaming-collar_1262-870.jpg"
id: "4", name: "David Kim", imageSrc: "http://img.b2bpic.net/free-photo/alone-specialist-handsome-daydreaming-collar_1262-870.jpg"
}
]}
/>
</div>
<div id="service-area" data-section="service-area">
<MetricCardTwo
title="Service Areas"
description="Proudly serving communities across North Dakota"
metrics={[
{
id: "1", value: "Bismarck", description: "Capital Region & Surrounding Area"
},
{
id: "2", value: "Fargo", description: "Red River Valley Region"
},
{
id: "3", value: "Grand Forks", description: "Northeast North Dakota"
},
{
id: "4", value: "Minot", description: "North Central Region"
}
]}
gridVariant="uniform-all-items-equal"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={true}
/>
</div>
<div id="final-cta" data-section="final-cta">
<ContactText
text="Ready to protect your property? Get a free roof estimate in 24 hours. No obligation. No pressure. Just honest expertise."
animationType="entrance-slide"
buttons={[
{ text: "Get Free Estimate", href: "/contact" },
{ text: "Call: 701-555-0100", href: "tel:+1-701-555-0100" }
{ text: 'Get Free Estimate', href: '/contact' },
{ text: 'Call: 701-555-0100', href: 'tel:+1-701-555-0100' }
]}
background={{ variant: "plain" }}
background={{ variant: 'plain' }}
useInvertedBackground={false}
/>
</div>
@@ -244,34 +168,34 @@ export default function HomePage() {
columns={[
{
items: [
{ label: "Home", href: "/" },
{ label: "Residential Roofing", href: "/residential" },
{ label: "Commercial Roofing", href: "/commercial" },
{ label: "Storm Damage", href: "/storm-damage" }
{ label: 'Home', href: '/' },
{ label: 'Residential Roofing', href: '/residential' },
{ label: 'Commercial Roofing', href: '/commercial' },
{ label: 'Storm Damage', href: '/storm-damage' }
]
},
{
items: [
{ label: "About Us", href: "/about" },
{ label: "Project Gallery", href: "/gallery" },
{ label: "Customer Reviews", href: "/reviews" },
{ label: "Contact Us", href: "/contact" }
{ label: 'About Us', href: '/about' },
{ label: 'Project Gallery', href: '/gallery' },
{ label: 'Customer Reviews', href: '/reviews' },
{ label: 'Contact Us', href: '/contact' }
]
},
{
items: [
{ label: "Licensed & Insured", href: "#" },
{ label: "Warranty Information", href: "#" },
{ label: "Privacy Policy", href: "#" },
{ label: "Terms of Service", href: "#" }
{ label: 'Licensed & Insured' },
{ label: 'Warranty Information' },
{ label: 'Privacy Policy' },
{ label: 'Terms of Service' }
]
},
{
items: [
{ label: "Emergency Service", href: "tel:+1-701-555-0100" },
{ label: "701-555-0100", href: "tel:+1-701-555-0100" },
{ label: "Monday - Friday: 8AM - 6PM", href: "#" },
{ label: "24/7 Emergency Hotline", href: "tel:+1-701-555-0101" }
{ label: 'Emergency Service', href: 'tel:+1-701-555-0100' },
{ label: '701-555-0100', href: 'tel:+1-701-555-0100' },
{ label: 'Monday - Friday: 8AM - 6PM' },
{ label: '24/7 Emergency Hotline', href: 'tel:+1-701-555-0101' }
]
}
]}

168
src/app/residential/page.tsx
View File

@@ -1,11 +1,12 @@
"use client";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import Link from 'next/link';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import SplitAbout from '@/components/sections/about/SplitAbout';
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { CheckCircle, Home, Shield } from 'lucide-react';
export default function ResidentialPage() {
return (
@@ -24,63 +25,65 @@ export default function ResidentialPage() {
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Home", id: "/" },
{ name: "Residential", id: "/residential" },
{ name: "Commercial", id: "/commercial" },
{ name: "Storm Damage", id: "/storm-damage" },
{ name: "Gallery", id: "/gallery" }
{ name: 'Home', id: '/' },
{ name: 'Residential', id: '/residential' },
{ name: 'Commercial', id: '/commercial' },
{ name: 'Storm Damage', id: '/storm-damage' },
{ name: 'Gallery', id: '/gallery' }
]}
button={{ text: "Get Free Estimate", href: "/contact" }}
button={{
text: 'Get Free Estimate',
href: '/contact'
}}
brandName="Northstar Roofing"
/>
</div>
<div id="hero" data-section="hero">
<HeroSplit
<div id="residential-hero" data-section="residential-hero">
<SplitAbout
title="Residential Roofing Excellence"
description="Protect your North Dakota home with premium roofing solutions. From new installations to emergency repairs, we deliver craftsmanship that stands up to harsh ND weather."
tag="Home Protection Specialists"
background={{ variant: "glowing-orb" }}
buttons={[
{ text: "Get Home Estimate", href: "/contact" },
{ text: "View Gallery", href: "/gallery" }
description="Protecting North Dakota homes with premium roofing solutions. From new installations to emergency repairs, we deliver quality craftsmanship with comprehensive warranties for your peace of mind."
tag="Residential Services"
tagIcon={Home}
textboxLayout="default"
useInvertedBackground={false}
bulletPoints={[
{
title: "Complete Roof Replacement", description: "Full system replacement with premium materials and professional installation. Comprehensive structural inspection included.", icon: CheckCircle
},
{
title: "Emergency Repairs", description: "24/7 emergency response for urgent roof issues. Fast, reliable repairs to prevent further damage to your home.", icon: Shield
},
{
title: "Warranty Protection", description: "Lifetime warranty on workmanship and extended manufacturer warranties on all materials for complete protection.", icon: Shield
}
]}
imageSrc="http://img.b2bpic.net/free-photo/beautiful-house-with-chimney-blue-sky_23-2149627194.jpg?_wi=1"
buttons={[
{ text: 'Schedule Inspection', href: '/contact' }
]}
imageSrc="http://img.b2bpic.net/free-photo/houses-surrounded-by-trees-covered-snow-larvik-norway_181624-11854.jpg?_wi=2"
imageAlt="Beautiful residential home with quality roofing"
imagePosition="right"
mediaAnimation="slide-up"
tagAnimation="entrance-slide"
/>
</div>
<div id="services" data-section="services">
<div id="residential-services" data-section="residential-services">
<FeatureCardTwentyFour
title="Residential Roofing Services"
description="Comprehensive roofing solutions designed specifically for North Dakota homes"
title="Comprehensive Residential Services"
description="Everything your home needs for complete roof protection"
features={[
{
id: "1",
title: "New Roof Installation",
author: "Complete Home Protection",
description: "Brand new roofing systems with architectural shingles, premium underlayment, and ventilation. Built to withstand ND winters and severe weather.",
tags: ["New Construction", "Upgrades", "Premium Materials"],
id: "1", title: "Architectural Shingles", author: "Premium Materials", description: "High-quality architectural shingles with enhanced durability and aesthetic appeal. Multiple color and style options available.", tags: ["Premium", "Durable", "Stylish"],
imageSrc: "http://img.b2bpic.net/free-photo/construction-worker-using-hammer-job-site_23-2150530695.jpg?_wi=2"
},
{
id: "2",
title: "Roof Repairs",
author: "Quick Fix Solutions",
description: "Fast, reliable repairs for leaks, missing shingles, damaged flashing, and storm damage. Emergency services available for urgent situations.",
tags: ["Emergency", "Fast Response", "Leak Repair"],
imageSrc: "http://img.b2bpic.net/free-photo/construction-worker-using-hammer-job-site_23-2150530689.jpg?_wi=2"
id: "2", title: "Gutter Systems", author: "Complete Protection", description: "Professional gutter installation and maintenance. Seamless gutters with proper drainage to protect your foundation.", tags: ["Drainage", "Foundation", "Protection"],
imageSrc: "http://img.b2bpic.net/free-photo/vertical-closeup-roof-drain-pipe_181624-46535.jpg"
},
{
id: "3",
title: "Gutter Systems",
author: "Water Management",
description: "Complete gutter installation and repair services. Protect your home's foundation with proper water drainage and ice dam prevention.",
tags: ["Drainage", "Foundation Protection", "Ice Dams"],
imageSrc: "http://img.b2bpic.net/free-photo/vertical-closeup-roof-drain-pipe_181624-46535.jpg"
id: "3", title: "Attic Ventilation", author: "Energy Efficiency", description: "Proper attic ventilation systems to improve energy efficiency and prevent moisture problems. Extends roof life significantly.", tags: ["Efficiency", "Moisture", "Longevity"],
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-house-with-chimney-blue-sky_23-2149627194.jpg?_wi=1"
}
]}
animationType="slide-up"
@@ -89,36 +92,31 @@ export default function ResidentialPage() {
/>
</div>
<div id="service-areas" data-section="service-areas">
<MetricCardTwo
title="Residential Service Areas"
description="Trusted by homeowners across North Dakota"
metrics={[
{
id: "1",
value: "Bismarck",
description: "Capital Region & Surrounding Communities"
},
{
id: "2",
value: "Fargo",
description: "Red River Valley Homes"
},
{
id: "3",
value: "Grand Forks",
description: "Northeast ND Residences"
},
{
id: "4",
value: "Minot",
description: "North Central Region Homes"
}
]
gridVariant="uniform-all-items-equal"
animationType="slide-up"
<div id="residential-process" data-section="residential-process">
<SplitAbout
title="Our Residential Process"
description="From initial consultation to project completion, we ensure every step meets our high standards and your expectations."
tag="Our Process"
textboxLayout="default"
useInvertedBackground={true}
bulletPoints={[
{
title: "Free Consultation", description: "Comprehensive roof inspection and detailed estimate. No hidden costs or surprise fees.", icon: CheckCircle
},
{
title: "Professional Installation", description: "Skilled craftsmen use premium materials and proven techniques for lasting results.", icon: CheckCircle
},
{
title: "Final Inspection", description: "Thorough quality check and cleanup. Your satisfaction is guaranteed before project completion.", icon: CheckCircle
}
]}
buttons={[
{ text: 'Get Started Today', href: '/contact' }
]}
imageSrc="http://img.b2bpic.net/free-photo/three-men-looking-aside-construction-site_259150-57679.jpg?_wi=1"
imageAlt="Professional roofing team at work"
imagePosition="left"
mediaAnimation="slide-up"
/>
</div>
@@ -128,34 +126,34 @@ export default function ResidentialPage() {
columns={[
{
items: [
{ label: "Home", href: "/" },
{ label: "Residential Roofing", href: "/residential" },
{ label: "Commercial Roofing", href: "/commercial" },
{ label: "Storm Damage", href: "/storm-damage" }
{ label: 'Home', href: '/' },
{ label: 'Residential Roofing', href: '/residential' },
{ label: 'Commercial Roofing', href: '/commercial' },
{ label: 'Storm Damage', href: '/storm-damage' }
]
},
{
items: [
{ label: "About Us", href: "/about" },
{ label: "Project Gallery", href: "/gallery" },
{ label: "Customer Reviews", href: "/reviews" },
{ label: "Contact Us", href: "/contact" }
{ label: 'About Us', href: '/about' },
{ label: 'Project Gallery', href: '/gallery' },
{ label: 'Customer Reviews', href: '/reviews' },
{ label: 'Contact Us', href: '/contact' }
]
},
{
items: [
{ label: "Licensed & Insured", href: "#" },
{ label: "Warranty Information", href: "#" },
{ label: "Privacy Policy", href: "#" },
{ label: "Terms of Service", href: "#" }
{ label: 'Licensed & Insured' },
{ label: 'Warranty Information' },
{ label: 'Privacy Policy' },
{ label: 'Terms of Service' }
]
},
{
items: [
{ label: "Emergency Service", href: "tel:+1-701-555-0100" },
{ label: "701-555-0100", href: "tel:+1-701-555-0100" },
{ label: "Monday - Friday: 8AM - 6PM", href: "#" },
{ label: "24/7 Emergency Hotline", href: "tel:+1-701-555-0101" }
{ label: 'Emergency Service', href: 'tel:+1-701-555-0100' },
{ label: '701-555-0100', href: 'tel:+1-701-555-0100' },
{ label: 'Monday - Friday: 8AM - 6PM' },
{ label: '24/7 Emergency Hotline', href: 'tel:+1-701-555-0101' }
]
}
]}

183
src/app/storm-damage/page.tsx
View File

@@ -1,12 +1,12 @@
"use client";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroSplit from '@/components/sections/hero/HeroSplit';
import SplitAbout from '@/components/sections/about/SplitAbout';
import ContactText from '@/components/sections/contact/ContactText';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import Link from 'next/link';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { CloudLightning, FileCheck, Clock, Phone } from "lucide-react";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import SplitAbout from '@/components/sections/about/SplitAbout';
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { CloudLightning, FileText, Zap, Shield } from 'lucide-react';
export default function StormDamagePage() {
return (
@@ -25,146 +25,135 @@ export default function StormDamagePage() {
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Home", id: "/" },
{ name: "Residential", id: "/residential" },
{ name: "Commercial", id: "/commercial" },
{ name: "Storm Damage", id: "/storm-damage" },
{ name: "Gallery", id: "/gallery" }
{ name: 'Home', id: '/' },
{ name: 'Residential', id: '/residential' },
{ name: 'Commercial', id: '/commercial' },
{ name: 'Storm Damage', id: '/storm-damage' },
{ name: 'Gallery', id: '/gallery' }
]}
button={{ text: "Get Free Estimate", href: "/contact" }}
button={{
text: 'Get Free Estimate',
href: '/contact'
}}
brandName="Northstar Roofing"
/>
</div>
<div id="hero" data-section="hero">
<HeroSplit
title="Storm Damage Restoration Experts"
description="Hail, wind, and ice damage restoration specialists. We handle everything from initial inspection to insurance claims to final installation. Fast response, professional results."
tag="Insurance Claims Specialists • 24/7 Emergency Response"
background={{ variant: "glowing-orb" }}
buttons={[
{ text: "Emergency Inspection", href: "/contact" },
{ text: "Call 24/7", href: "tel:+1-701-555-0101" }
<div id="storm-damage-hero" data-section="storm-damage-hero">
<SplitAbout
title="Storm Damage? We're Here to Help"
description="Hail, wind, and ice damage? Our expert team handles the entire process from inspection to insurance claim support to final installation. Get your roof restored quickly and properly."
tag="Storm Response"
tagIcon={CloudLightning}
textboxLayout="default"
useInvertedBackground={true}
bulletPoints={[
{
title: "Free Storm Inspection", description: "Same-day inspections available. Detailed damage assessment and photo documentation for your insurance claim.", icon: Shield
},
{
title: "Insurance Claim Support", description: "We work directly with your insurance company. Professional documentation ensures faster claim approval and maximum coverage.", icon: FileText
},
{
title: "Quick Response Time", description: "24/7 emergency availability. Most urgent repairs completed within 24-48 hours to prevent further water damage.", icon: Zap
}
]}
imageSrc="http://img.b2bpic.net/free-photo/old-rusty-metallic-surface_23-2148846057.jpg?_wi=3"
imageAlt="Storm damage assessment and repair"
buttons={[
{ text: 'Book Storm Inspection', href: '/contact' }
]}
imageSrc="http://img.b2bpic.net/free-photo/close-up-businessman-standing-front-table-writing-diary-with-pen_23-2148087135.jpg?_wi=1"
imageAlt="Storm damage inspection and assessment"
imagePosition="right"
mediaAnimation="slide-up"
tagAnimation="entrance-slide"
/>
</div>
<div id="storm-services" data-section="storm-services">
<FeatureCardTwentyFour
title="Storm Damage Services"
description="Complete storm restoration from emergency repairs to full replacement"
features={[
{
id: "1", title: "Hail Damage Assessment", author: "Certified Inspectors", description: "Professional hail damage documentation with detailed reports and photography for insurance claims. Quick response after storms.", tags: ["Hail Damage", "Insurance", "Documentation"],
imageSrc: "http://img.b2bpic.net/free-photo/old-rusty-metallic-surface_23-2148846057.jpg?_wi=3"
},
{
id: "2", title: "Wind Damage Repair", author: "Emergency Response", description: "Emergency repairs for wind damage including missing shingles, damaged flashing, and structural issues. 24/7 availability.", tags: ["Wind Damage", "Emergency", "24/7"],
imageSrc: "http://img.b2bpic.net/free-photo/homemade-house_1361-130.jpg?_wi=1"
},
{
id: "3", title: "Insurance Claims", author: "Claims Specialists", description: "Full insurance claim support including documentation, adjuster meetings, and claim negotiation for maximum coverage.", tags: ["Claims", "Negotiation", "Maximum Coverage"],
imageSrc: "http://img.b2bpic.net/free-photo/close-up-businessman-standing-front-table-writing-diary-with-pen_23-2148087135.jpg?_wi=2"
}
]}
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
/>
</div>
<div id="storm-process" data-section="storm-process">
<SplitAbout
title="Our Storm Damage Process"
description="From initial damage assessment to final restoration, we handle every step of the storm damage recovery process professionally and efficiently."
tag="Complete Storm Recovery"
tagIcon={CloudLightning}
description="From initial damage assessment to final restoration, we guide you through every step of the storm damage recovery process."
tag="Recovery Process"
textboxLayout="default"
useInvertedBackground={false}
bulletPoints={[
{
title: "Emergency Inspection",
description: "Same-day storm damage assessment with detailed photo documentation. Free inspections for insurance claim support.",
icon: CloudLightning
title: "Immediate Response", description: "Emergency tarping and temporary repairs to prevent further damage while planning permanent restoration.", icon: Zap
},
{
title: "Insurance Documentation",
description: "Professional damage reports and photo documentation. We work directly with your insurance adjuster for faster claims.",
icon: FileCheck
title: "Documentation & Claims", description: "Comprehensive damage documentation and insurance claim filing. We handle all paperwork and communications.", icon: FileText
},
{
title: "Fast Restoration",
description: "Once approved, we begin restoration immediately. Most storm damage repairs completed within days, not weeks.",
icon: Clock
},
{
title: "24/7 Emergency Service",
description: "Emergency tarping and temporary repairs available around the clock to prevent further damage to your property.",
icon: Phone
title: "Professional Restoration", description: "Complete restoration using premium materials and proven techniques. Your property will be better than before.", icon: Shield
}
]}
buttons={[{ text: "Schedule Storm Inspection", href: "/contact" }]}
imageSrc="http://img.b2bpic.net/free-photo/close-up-businessman-standing-front-table-writing-diary-with-pen_23-2148087135.jpg?_wi=2"
imageAlt="Professional storm damage documentation"
imagePosition="right"
mediaAnimation="slide-up"
/>
</div>
<div id="insurance-support" data-section="insurance-support">
<SplitAbout
title="Insurance Claims Made Simple"
description="Navigate the insurance claims process with confidence. Our experts handle the documentation, communication, and coordination with your insurance company."
tag="Claims Experts"
textboxLayout="default"
useInvertedBackground={true}
bulletPoints={[
{
title: "Claims Documentation",
description: "Comprehensive damage reports with professional photography and detailed assessments for maximum claim value.",
icon: FileCheck
},
{
title: "Adjuster Meetings",
description: "We meet with your insurance adjuster on-site to ensure all damage is properly identified and documented.",
icon: Phone
}
buttons={[
{ text: 'Report Storm Damage', href: '/contact' }
]}
imageSrc="http://img.b2bpic.net/free-photo/three-men-looking-aside-construction-site_259150-57679.jpg?_wi=3"
imageAlt="Insurance claims support team"
imageAlt="Storm damage restoration team"
imagePosition="left"
mediaAnimation="slide-up"
/>
</div>
<div id="emergency-contact" data-section="emergency-contact">
<ContactText
text="Storm damage? Don't wait. Call our 24/7 emergency hotline for immediate response and temporary repairs to prevent further damage."
animationType="entrance-slide"
buttons={[
{ text: "24/7 Emergency: 701-555-0101", href: "tel:+1-701-555-0101" },
{ text: "Schedule Inspection", href: "/contact" }
]}
background={{ variant: "plain" }}
useInvertedBackground={false}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
logoText="Northstar Roofing"
columns={[
{
items: [
{ label: "Home", href: "/" },
{ label: "Residential Roofing", href: "/residential" },
{ label: "Commercial Roofing", href: "/commercial" },
{ label: "Storm Damage", href: "/storm-damage" }
{ label: 'Home', href: '/' },
{ label: 'Residential Roofing', href: '/residential' },
{ label: 'Commercial Roofing', href: '/commercial' },
{ label: 'Storm Damage', href: '/storm-damage' }
]
},
{
items: [
{ label: "About Us", href: "/about" },
{ label: "Project Gallery", href: "/gallery" },
{ label: "Customer Reviews", href: "/reviews" },
{ label: "Contact Us", href: "/contact" }
{ label: 'About Us', href: '/about' },
{ label: 'Project Gallery', href: '/gallery' },
{ label: 'Customer Reviews', href: '/reviews' },
{ label: 'Contact Us', href: '/contact' }
]
},
{
items: [
{ label: "Licensed & Insured", href: "#" },
{ label: "Warranty Information", href: "#" },
{ label: "Privacy Policy", href: "#" },
{ label: "Terms of Service", href: "#" }
{ label: 'Licensed & Insured' },
{ label: 'Warranty Information' },
{ label: 'Privacy Policy' },
{ label: 'Terms of Service' }
]
},
{
items: [
{ label: "Emergency Service", href: "tel:+1-701-555-0100" },
{ label: "701-555-0100", href: "tel:+1-701-555-0100" },
{ label: "Monday - Friday: 8AM - 6PM", href: "#" },
{ label: "24/7 Emergency Hotline", href: "tel:+1-701-555-0101" }
{ label: 'Emergency Service', href: 'tel:+1-701-555-0100' },
{ label: '701-555-0100', href: 'tel:+1-701-555-0100' },
{ label: 'Monday - Friday: 8AM - 6PM' },
{ label: '24/7 Emergency Hotline', href: 'tel:+1-701-555-0101' }
]
}
]}