114 lines
4.6 KiB
TypeScript
114 lines
4.6 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
|
|
import FeatureBento from "@/components/sections/feature/FeatureBento";
|
|
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
|
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
|
|
import Link from "next/link";
|
|
import {
|
|
Shield,
|
|
Wrench,
|
|
AlertCircle,
|
|
Home,
|
|
Building2,
|
|
Star,
|
|
Square,
|
|
Zap,
|
|
Droplets,
|
|
Clock,
|
|
Phone,
|
|
AlertTriangle,
|
|
} from "lucide-react";
|
|
|
|
export default function ServicesPage() {
|
|
const navItems = [
|
|
{ name: "Home", id: "/" },
|
|
{ name: "Services", id: "/services" },
|
|
{ name: "Why Us", id: "/why-us" },
|
|
{ name: "Contact", id: "/contact" },
|
|
];
|
|
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="shift-hover"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="pill"
|
|
contentWidth="small"
|
|
sizing="largeSizeMediumTitles"
|
|
background="circleGradient"
|
|
cardStyle="gradient-radial"
|
|
primaryButtonStyle="gradient"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="normal"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple
|
|
brandName="Nottingham Premier Roofing"
|
|
navItems={navItems.map((item) => ({
|
|
name: item.name,
|
|
id: item.id === "/" ? "/" : item.id,
|
|
}))}
|
|
/>
|
|
</div>
|
|
|
|
<div id="services-detail" data-section="services-detail">
|
|
<FeatureBento
|
|
title="Professional Roofing Services Tailored to Your Needs"
|
|
description="Whether you need emergency repairs, a complete roof installation, or specialized flat roofing services, our experienced team has the expertise to handle every project with precision and care."
|
|
tag="Expert Solutions"
|
|
features={[
|
|
{
|
|
title: "Emergency Roof Repairs", description: "Immediate response to leaks, storm damage, and urgent roofing issues. Available 24/7 for your peace of mind.", bentoComponent: "icon-info-cards", items: [
|
|
{ icon: AlertCircle, label: "Same-Day Response", value: "Available" },
|
|
{ icon: Shield, label: "Emergency Coverage", value: "24/7" },
|
|
{ icon: Wrench, label: "Fast Turnaround", value: "24-48hrs" },
|
|
],
|
|
},
|
|
{
|
|
title: "New Roof Installations", description: "Complete roof replacements and new installations using premium quality materials. Full consultation and design service included.", bentoComponent: "icon-info-cards", items: [
|
|
{ icon: Home, label: "Residential", value: "Expert Work" },
|
|
{ icon: Building2, label: "Commercial", value: "Professional" },
|
|
{ icon: Star, label: "Quality Materials", value: "Guaranteed" },
|
|
],
|
|
},
|
|
{
|
|
title: "Flat Roof Specialization", description: "Dedicated expertise in flat roofing systems including EPDM rubber, felt, and slate applications for modern properties.", bentoComponent: "icon-info-cards", items: [
|
|
{ icon: Square, label: "EPDM Systems", value: "Durable" },
|
|
{ icon: Droplets, label: "Waterproofing", value: "Certified" },
|
|
{ icon: Zap, label: "Modern Materials", value: "Available" },
|
|
],
|
|
},
|
|
]}
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
carouselMode="buttons"
|
|
/>
|
|
</div>
|
|
|
|
<div id="services-cta" data-section="services-cta">
|
|
<ContactCTA
|
|
tag="Ready to Get Started?"
|
|
tagIcon={Phone}
|
|
title="Schedule Your Service Today"
|
|
description="Contact our team to discuss your roofing needs and receive a free, no-obligation quote. We're committed to delivering exceptional results on every project."
|
|
buttons={[
|
|
{ text: "Book Free Assessment", href: "/contact" },
|
|
{ text: "Call: 0115 912 3456", href: "tel:+441159123456" },
|
|
]}
|
|
background={{ variant: "plain" }}
|
|
useInvertedBackground={false}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoReveal
|
|
logoText="Nottingham Premier Roofing"
|
|
leftLink={{ text: "Privacy Policy", href: "#" }}
|
|
rightLink={{ text: "Terms & Conditions", href: "#" }}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |