Merge version_1 into main #2

Merged
bender merged 2 commits from version_1 into main 2026-04-04 21:41:34 +00:00
2 changed files with 123 additions and 364 deletions

View File

@@ -9,7 +9,7 @@ import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import SplitAbout from '@/components/sections/about/SplitAbout';
import { Clock, Smile, Wrench } from "lucide-react";
import { Zap, Square, Shield, Home, Wrench, Clock, Smile } from "lucide-react";
export default function LandingPage() {
return (
@@ -26,253 +26,82 @@ export default function LandingPage() {
headingFontWeight="semibold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{
name: "Home",
id: "/",
},
{
name: "Services",
id: "/services",
},
{
name: "Gallery",
id: "/gallery",
},
{
name: "Contact",
id: "/contact",
},
]}
brandName="Hope Roofing"
/>
</div>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Home", id: "/" },
{ name: "Services", id: "/services" },
{ name: "Gallery", id: "/gallery" },
{ name: "Contact", id: "/contact" },
]}
brandName="Hope Roofing"
/>
</div>
<div id="home-hero" data-section="home-hero">
<HeroOverlayTestimonial
title="Trusted Roofing Experts in Bournemouth"
description="Fast, reliable repairs & installations at fair prices. Local experts you can depend on."
testimonials={[
{
name: "Sarah J.",
handle: "Homeowner",
testimonial: "Quick response & fair quote. Excellent service.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/expressive-middle-aged-woman-posing_344912-2831.jpg?_wi=1",
},
{
name: "Mark D.",
handle: "Homeowner",
testimonial: "Professional work, repaired my flat roof within 24 hours.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-working-as-real-estate-agent_23-2151064886.jpg?_wi=1",
},
{
name: "James L.",
handle: "Property Manager",
testimonial: "Exceptional communication and quality finish.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/expressive-middle-aged-woman-posing_344912-2831.jpg?_wi=2",
},
{
name: "Elena P.",
handle: "Resident",
testimonial: "Very professional and left the site clean.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-working-as-real-estate-agent_23-2151064886.jpg?_wi=2",
},
{
name: "Robert B.",
handle: "Homeowner",
testimonial: "Highly recommended for chimney work!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/expressive-middle-aged-woman-posing_344912-2831.jpg?_wi=3",
},
]}
buttons={[
{
text: "Call Now: 07958 567911",
href: "tel:07958567911",
},
{
text: "Get Free Quote",
href: "/contact",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-13093.jpg?_wi=1"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/expressive-middle-aged-woman-posing_344912-2831.jpg",
alt: "Customer",
},
{
src: "http://img.b2bpic.net/free-photo/medium-shot-man-working-as-real-estate-agent_23-2151064886.jpg",
alt: "Customer",
},
{
src: "http://img.b2bpic.net/free-photo/expressive-middle-aged-woman-posing_344912-2831.jpg",
alt: "Customer",
},
{
src: "http://img.b2bpic.net/free-photo/medium-shot-man-working-as-real-estate-agent_23-2151064886.jpg",
alt: "Customer",
},
{
src: "http://img.b2bpic.net/free-photo/expressive-middle-aged-woman-posing_344912-2831.jpg",
alt: "Customer",
},
]}
avatarText="Trusted by 500+ local customers"
/>
</div>
<div id="home-hero" data-section="home-hero">
<HeroOverlayTestimonial
title="Trusted Roofing Experts in Bournemouth"
description="Fast, reliable repairs & installations at fair prices. Local experts you can depend on."
testimonials={[
{ name: "Sarah J.", handle: "Homeowner", testimonial: "Quick response & fair quote. Excellent service.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/expressive-middle-aged-woman-posing_344912-2831.jpg" },
{ name: "Mark D.", handle: "Homeowner", testimonial: "Professional work, repaired my flat roof within 24 hours.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-working-as-real-estate-agent_23-2151064886.jpg" },
{ name: "James L.", handle: "Property Manager", testimonial: "Exceptional communication and quality finish.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/expressive-middle-aged-woman-posing_344912-2831.jpg" },
{ name: "Elena P.", handle: "Resident", testimonial: "Very professional and left the site clean.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-working-as-real-estate-agent_23-2151064886.jpg" },
{ name: "Robert B.", handle: "Homeowner", testimonial: "Highly recommended for chimney work!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/expressive-middle-aged-woman-posing_344912-2831.jpg" },
]}
buttons={[{ text: "Call Now: 07958 567911", href: "tel:07958567911" }, { text: "Get Free Quote", href: "/contact" }]}
imageSrc="http://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-13093.jpg"
avatars={[
{ src: "http://img.b2bpic.net/free-photo/expressive-middle-aged-woman-posing_344912-2831.jpg", alt: "Customer" },
{ src: "http://img.b2bpic.net/free-photo/medium-shot-man-working-as-real-estate-agent_23-2151064886.jpg", alt: "Customer" },
{ src: "http://img.b2bpic.net/free-photo/expressive-middle-aged-woman-posing_344912-2831.jpg", alt: "Customer" },
{ src: "http://img.b2bpic.net/free-photo/medium-shot-man-working-as-real-estate-agent_23-2151064886.jpg", alt: "Customer" },
{ src: "http://img.b2bpic.net/free-photo/expressive-middle-aged-woman-posing_344912-2831.jpg", alt: "Customer" },
]}
avatarText="Trusted by 500+ local customers"
/>
</div>
<div id="services-features" data-section="services-features">
<FeatureCardTwentySix
textboxLayout="default"
useInvertedBackground={true}
features={[
{
title: "Roof Repairs",
description: "Expert fixing of leaks and damaged tiles.",
buttonIcon: "Zap",
imageSrc: "http://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-13093.jpg?_wi=2",
imageAlt: "residential roof repair service",
},
{
title: "Flat Roofing",
description: "High-quality EPDM and asphalt flat roof systems.",
buttonIcon: "Square",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-smiling-construction-engineer_23-2148233726.jpg?_wi=1",
imageAlt: "professional roofer smiling",
},
{
title: "Leadwork",
description: "Precision lead flashings and weatherproofing.",
buttonIcon: "Shield",
imageSrc: "http://img.b2bpic.net/free-photo/expressive-middle-aged-woman-posing_344912-2831.jpg?_wi=4",
imageAlt: "happy customer portrait",
},
{
title: "Chimney Repairs",
description: "Safe, reliable chimney stack maintenance.",
buttonIcon: "Home",
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-working-as-real-estate-agent_23-2151064886.jpg?_wi=3",
imageAlt: "homeowner standing in front of house",
},
]}
title="Our Roofing Services"
description="Professional roofing solutions for every property type."
/>
</div>
<div id="services-features" data-section="services-features">
<FeatureCardTwentySix
textboxLayout="default"
useInvertedBackground={true}
features={[
{ title: "Roof Repairs", description: "Expert fixing of leaks and damaged tiles.", buttonIcon: Zap, imageSrc: "http://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-13093.jpg", imageAlt: "residential roof repair service" },
{ title: "Flat Roofing", description: "High-quality EPDM and asphalt flat roof systems.", buttonIcon: Square, imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-smiling-construction-engineer_23-2148233726.jpg", imageAlt: "professional roofer smiling" },
{ title: "Leadwork", description: "Precision lead flashings and weatherproofing.", buttonIcon: Shield, imageSrc: "http://img.b2bpic.net/free-photo/expressive-middle-aged-woman-posing_344912-2831.jpg", imageAlt: "happy customer portrait" },
{ title: "Chimney Repairs", description: "Safe, reliable chimney stack maintenance.", buttonIcon: Home, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-working-as-real-estate-agent_23-2151064886.jpg", imageAlt: "homeowner standing in front of house" },
]}
title="Our Roofing Services"
description="Professional roofing solutions for every property type."
/>
</div>
<div id="socialProof" data-section="socialProof">
<SocialProofOne
textboxLayout="default"
useInvertedBackground={false}
title="Trusted Partners"
description="We collaborate with the best in the industry to ensure quality."
names={[
"Bournemouth Building Supplies",
"Lead Contractors Union",
"Roofing Safety Council",
"Local Property Guild",
"Bournemouth Home Experts",
]}
/>
</div>
<div id="metric" data-section="metric">
<MetricCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
title="Our Impact in Numbers"
description="We are proud of our contributions to the Bournemouth community."
metrics={[
{ id: "1", value: "1500+", title: "Roofs Repaired", description: "Successful projects completed.", icon: Wrench },
{ id: "2", value: "20+", title: "Years Experience", description: "Decades of professional service.", icon: Clock },
{ id: "3", value: "100%", title: "Satisfied Clients", description: "Quality assurance guaranteed.", icon: Smile },
]}
/>
</div>
<div id="about" data-section="about">
<SplitAbout
textboxLayout="default"
useInvertedBackground={false}
title="Why Choose Hope Roofing?"
description="With over 20 years of experience, we bring local expertise and dedication to every roof we work on."
imageSrc="http://img.b2bpic.net/free-photo/close-up-portrait-smiling-construction-engineer_23-2148233726.jpg?_wi=2"
bulletPoints={[
{
title: "Certified Tradesmen",
description: "Fully insured and NFRC registered.",
},
{
title: "Fixed Price Quotes",
description: "No hidden costs, no surprises.",
},
{
title: "24/7 Support",
description: "Available for emergency repairs round the clock.",
},
]}
mediaAnimation="slide-up"
/>
</div>
<div id="metric" data-section="metric">
<MetricCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
title="Our Impact in Numbers"
description="We are proud of our contributions to the Bournemouth community."
metrics={[
{
id: "1",
value: "1500+",
title: "Roofs Repaired",
description: "Successful projects completed.",
icon: Wrench,
},
{
id: "2",
value: "20+",
title: "Years Experience",
description: "Decades of professional service.",
icon: Clock,
},
{
id: "3",
value: "100%",
title: "Satisfied Clients",
description: "Quality assurance guaranteed.",
icon: Smile,
},
]}
/>
</div>
<div id="home-footer" data-section="home-footer">
<FooterLogoEmphasis
columns={[
{
items: [
{
label: "Services",
href: "/services",
},
{
label: "Gallery",
href: "/gallery",
},
],
},
{
items: [
{
label: "Contact",
href: "/contact",
},
{
label: "07958 567911",
href: "tel:07958567911",
},
],
},
]}
logoText="Hope Roofing & Leadwork LTD"
/>
</div>
<div id="home-footer" data-section="home-footer">
<FooterLogoEmphasis
columns={[
{ items: [{ label: "Services", href: "/services" }, { label: "Gallery", href: "/gallery" }] },
{ items: [{ label: "Contact", href: "/contact" }, { label: "07958 567911", href: "tel:07958567911" }] },
]}
logoText="Hope Roofing & Leadwork LTD"
/>
</div>
</ReactLenis>
</ThemeProvider>
);

View File

@@ -6,9 +6,9 @@ import FeatureBorderGlow from '@/components/sections/feature/featureBorderGlow/F
import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import { Calendar, CheckCircle, Shield } from "lucide-react";
import { Droplets, ArrowDown, Hammer, AlertCircle, Calendar, CheckCircle, Shield } from "lucide-react";
export default function LandingPage() {
export default function ServicesPage() {
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
@@ -23,127 +23,57 @@ export default function LandingPage() {
headingFontWeight="semibold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{
name: "Home",
id: "/",
},
{
name: "Services",
id: "/services",
},
{
name: "Gallery",
id: "/gallery",
},
{
name: "Contact",
id: "/contact",
},
]}
brandName="Hope Roofing"
/>
</div>
<div id="nav" data-section="nav">
<NavbarStyleCentered
navItems={[
{ name: "Home", id: "/" },
{ name: "Services", id: "/services" },
{ name: "Gallery", id: "/gallery" },
{ name: "Contact", id: "/contact" },
]}
brandName="Hope Roofing"
/>
</div>
<div id="services-page-body" data-section="services-page-body">
<FeatureCardTwentySix
textboxLayout="default"
useInvertedBackground={false}
features={[
{
title: "Guttering",
description: "Full cleaning and replacement services.",
buttonIcon: "Droplets",
imageSrc: "http://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-13093.jpg?_wi=3",
imageAlt: "residential roof repair service",
},
{
title: "Drainage",
description: "Ensuring optimal water flow off your roof.",
buttonIcon: "ArrowDown",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-smiling-construction-engineer_23-2148233726.jpg?_wi=3",
imageAlt: "professional roofer smiling",
},
{
title: "New Roofs",
description: "Complete strip and re-tile service.",
buttonIcon: "Hammer",
imageSrc: "http://img.b2bpic.net/free-photo/expressive-middle-aged-woman-posing_344912-2831.jpg?_wi=5",
imageAlt: "happy customer portrait",
},
{
title: "Emergency Repairs",
description: "Available for urgent storm damage.",
buttonIcon: "AlertCircle",
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-working-as-real-estate-agent_23-2151064886.jpg?_wi=4",
imageAlt: "homeowner standing in front of house",
},
]}
title="Detailed Service List"
description="Comprehensive roofing and leadwork for Bournemouth homeowners."
/>
</div>
<div id="services-page-body" data-section="services-page-body">
<FeatureCardTwentySix
textboxLayout="default"
useInvertedBackground={false}
features={[
{ title: "Guttering", description: "Full cleaning and replacement services.", buttonIcon: Droplets, imageSrc: "http://img.b2bpic.net/free-photo/photo-wood-texture-pattern_58702-13093.jpg", imageAlt: "residential roof repair service" },
{ title: "Drainage", description: "Ensuring optimal water flow off your roof.", buttonIcon: ArrowDown, imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-smiling-construction-engineer_23-2148233726.jpg", imageAlt: "professional roofer smiling" },
{ title: "New Roofs", description: "Complete strip and re-tile service.", buttonIcon: Hammer, imageSrc: "http://img.b2bpic.net/free-photo/expressive-middle-aged-woman-posing_344912-2831.jpg", imageAlt: "happy customer portrait" },
{ title: "Emergency Repairs", description: "Available for urgent storm damage.", buttonIcon: AlertCircle, imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-working-as-real-estate-agent_23-2151064886.jpg", imageAlt: "homeowner standing in front of house" },
]}
title="Detailed Service List"
description="Comprehensive roofing and leadwork for Bournemouth homeowners."
/>
</div>
<div id="feature" data-section="feature">
<FeatureBorderGlow
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
title="Our Standards"
description="We maintain the highest industry standards for every service."
features={[
{
icon: Shield,
title: "Safety First",
description: "Strict adherence to safety guidelines.",
},
{
icon: CheckCircle,
title: "High Quality",
description: "Using only premium materials.",
},
{
icon: Calendar,
title: "Timely Delivery",
description: "Meeting every project deadline.",
},
]}
/>
</div>
<div id="feature" data-section="feature">
<FeatureBorderGlow
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
title="Our Standards"
description="We maintain the highest industry standards for every service."
features={[
{ icon: Shield, title: "Safety First", description: "Strict adherence to safety guidelines." },
{ icon: CheckCircle, title: "High Quality", description: "Using only premium materials." },
{ icon: Calendar, title: "Timely Delivery", description: "Meeting every project deadline." },
]}
/>
</div>
<div id="home-footer" data-section="home-footer">
<FooterLogoEmphasis
columns={[
{
items: [
{
label: "Services",
href: "/services",
},
{
label: "Gallery",
href: "/gallery",
},
],
},
{
items: [
{
label: "Contact",
href: "/contact",
},
{
label: "07958 567911",
href: "tel:07958567911",
},
],
},
]}
logoText="Hope Roofing & Leadwork LTD"
/>
</div>
<div id="home-footer" data-section="home-footer">
<FooterLogoEmphasis
columns={[
{ items: [{ label: "Services", href: "/services" }, { label: "Gallery", href: "/gallery" }] },
{ items: [{ label: "Contact", href: "/contact" }, { label: "07958 567911", href: "tel:07958567911" }] },
]}
logoText="Hope Roofing & Leadwork LTD"
/>
</div>
</ReactLenis>
</ThemeProvider>
);