Merge version_3 into main #6
272
src/app/page.tsx
272
src/app/page.tsx
@@ -1,206 +1,170 @@
|
||||
"use client";
|
||||
|
||||
import Link from "next/link";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||||
import HeroCarouselLogo from "@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo";
|
||||
import FeatureCardSeven from "@/components/sections/feature/FeatureCardSeven";
|
||||
import TestimonialAboutCard from "@/components/sections/about/TestimonialAboutCard";
|
||||
import ProductCardFour from "@/components/sections/product/ProductCardFour";
|
||||
import TestimonialCardSix from "@/components/sections/testimonial/TestimonialCardSix";
|
||||
import ContactText from "@/components/sections/contact/ContactText";
|
||||
import FooterBase from "@/components/sections/footer/FooterBase";
|
||||
import { Zap, Quote } from "lucide-react";
|
||||
import { ThemeProvider } from "@/components/theme/ThemeProvider";
|
||||
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
|
||||
import HeroBillboardGallery from "@/components/sections/hero/HeroBillboardGallery";
|
||||
import TextAbout from "@/components/sections/about/TextAbout";
|
||||
import FeatureCardSix from "@/components/sections/feature/FeatureCardSix";
|
||||
import PricingCardOne from "@/components/sections/pricing/PricingCardOne";
|
||||
import ContactCenter from "@/components/sections/contact/ContactCenter";
|
||||
import FooterCard from "@/components/sections/footer/FooterCard";
|
||||
import { Mail, Phone, MapPin, Twitter, Linkedin } from "lucide-react";
|
||||
|
||||
export default function HomePage() {
|
||||
const navItems = [
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
{ name: "FAQ", id: "faq" },
|
||||
];
|
||||
|
||||
const heroSlides = [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/electrician-overalls-focused-work-switchboard-with-fuses-using-tablet_169016-66854.jpg", imageAlt: "Professional electrician working on switchboard"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-male-electrician-doing-some-repairs-laundry-room-looking-washing-machine_662251-2755.jpg?_wi=1", imageAlt: "Modern electrical switchboard installation"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/solar-panels-house-roof_23-2151951212.jpg?_wi=1", imageAlt: "Solar panels on residential roof"},
|
||||
];
|
||||
|
||||
const features = [
|
||||
const page = () => {
|
||||
const services = [
|
||||
{
|
||||
id: 1,
|
||||
title: "Residential Services", description: "Rewiring, switchboards, power points, smoke alarms, downlights, outdoor lighting, and hot water installations for your home", imageSrc: "http://img.b2bpic.net/free-photo/young-male-electrician-doing-some-repairs-laundry-room-looking-washing-machine_662251-2755.jpg?_wi=2", imageAlt: "Residential electrical work"},
|
||||
title: "Residential Electrical", description: "Professional electrical installation, maintenance, and repair services for your home. From rewiring to lighting solutions, we handle all your residential needs.", imageSrc: "/images/residential.jpg", imageAlt: "Residential electrical work"},
|
||||
{
|
||||
id: 2,
|
||||
title: "Commercial Solutions", description: "3-phase supply, power distribution, data cabling, CCTV, and fire alarms for offices, shops, schools, and facilities", imageSrc: "http://img.b2bpic.net/free-photo/hallway-building_23-2149397551.jpg?_wi=1", imageAlt: "Commercial electrical installation"},
|
||||
title: "Commercial Electrical", description: "Comprehensive commercial electrical services including installation, maintenance, and emergency support. We service businesses of all sizes.", imageSrc: "/images/commercial.jpg", imageAlt: "Commercial electrical installation"},
|
||||
{
|
||||
id: 3,
|
||||
title: "Solar & Smart Systems", description: "Solar power installations, C-Bus smart home systems, and heat pump solutions for energy-efficient homes", imageSrc: "http://img.b2bpic.net/free-photo/solar-panels-house-roof_23-2151951212.jpg?_wi=2", imageAlt: "Solar panel installation"},
|
||||
title: "Solar Installation", description: "Expert solar panel installation and maintenance to help you save on energy costs. Maximize your energy independence with our professional solar solutions.", imageSrc: "/images/solar.jpg", imageAlt: "Solar panel installation"},
|
||||
{
|
||||
id: 4,
|
||||
title: "Emergency Services", description: "24/7 emergency electrical support when you need it most. Our rapid response team is ready to handle power outages, electrical faults, and urgent repairs.", imageSrc: "/images/emergency.jpg", imageAlt: "Emergency electrical repair"},
|
||||
];
|
||||
|
||||
const products = [
|
||||
const pricingPlans = [
|
||||
{
|
||||
id: "1", name: "Switchboards & Safety Switches", price: "By Quote", variant: "Residential & Commercial", imageSrc: "http://img.b2bpic.net/free-photo/young-male-electrician-doing-some-repairs-laundry-room-looking-washing-machine_662251-2755.jpg?_wi=3", imageAlt: "Electrical switchboard"},
|
||||
{
|
||||
id: "2", name: "Lighting Installation", price: "From $250", variant: "Downlights, Outdoor, Smart", imageSrc: "http://img.b2bpic.net/free-photo/interior-shot-luxurious-house-dining-room_181624-10412.jpg", imageAlt: "Recessed downlighting"},
|
||||
{
|
||||
id: "3", name: "Solar Power Systems", price: "By Quote", variant: "Full Installation & Setup", imageSrc: "http://img.b2bpic.net/free-photo/solar-panels-house-roof_23-2151951212.jpg?_wi=3", imageAlt: "Solar panel installation"},
|
||||
{
|
||||
id: "4", name: "Emergency Services", price: "24/7 Available", variant: "Same-Day Response", imageSrc: "http://img.b2bpic.net/free-photo/hallway-building_23-2149397551.jpg?_wi=2", imageAlt: "Emergency electrical work"},
|
||||
];
|
||||
|
||||
const testimonials = [
|
||||
{
|
||||
id: "1", name: "John Smith", handle: "Residential Client", testimonial: "M&T Kelly completely rewired our 1970s home. Professional, punctual, and they left the place spotless. Highly recommended!", imageSrc: "http://img.b2bpic.net/free-photo/horizontal-shot-handsome-young-maintenance-service-worker-wearing-white-helmet_343059-3521.jpg?_wi=1", imageAlt: "John Smith"},
|
||||
{
|
||||
id: "2", name: "Sarah Johnson", handle: "Business Owner", testimonial: "Fantastic service for our commercial property. They handled everything from design to completion with expertise and care.", imageSrc: "http://img.b2bpic.net/free-photo/content-beautiful-businesswoman-standing-window_1262-1778.jpg?_wi=1", imageAlt: "Sarah Johnson"},
|
||||
{
|
||||
id: "3", name: "Michael Chen", handle: "Solar Customer", testimonial: "Had solar installed by M&T Kelly and couldn't be happier. Great savings and the system works perfectly. Very knowledgeable team!", imageSrc: "http://img.b2bpic.net/free-photo/executive-blue-suit-arms-crossed_1139-200.jpg", imageAlt: "Michael Chen"},
|
||||
{
|
||||
id: "4", name: "Emily Rodriguez", handle: "Emergency Call", testimonial: "Called them at midnight for an electrical emergency. They arrived quickly and fixed the problem professionally. True local heroes!", imageSrc: "http://img.b2bpic.net/free-photo/smiling-beautiful-middle-aged-business-woman_1262-3085.jpg", imageAlt: "Emily Rodriguez"},
|
||||
{
|
||||
id: "5", name: "David Wilson", handle: "Kitchen Renovation", testimonial: "Coordinated perfectly with our builder during our kitchen reno. Understood the brief instantly and delivered flawlessly.", imageSrc: "http://img.b2bpic.net/free-photo/horizontal-shot-handsome-young-maintenance-service-worker-wearing-white-helmet_343059-3521.jpg?_wi=2", imageAlt: "David Wilson"},
|
||||
{
|
||||
id: "6", name: "Lisa Thompson", handle: "Bathroom Upgrade", testimonial: "Owner-operated means you get the best. Attention to detail is exceptional. Will definitely use them again!", imageSrc: "http://img.b2bpic.net/free-photo/content-beautiful-businesswoman-standing-window_1262-1778.jpg?_wi=2", imageAlt: "Lisa Thompson"},
|
||||
];
|
||||
|
||||
const footerColumns = [
|
||||
{
|
||||
title: "Services", items: [
|
||||
{ label: "Residential", href: "#services" },
|
||||
{ label: "Commercial", href: "#services" },
|
||||
{ label: "Solar Power", href: "#services" },
|
||||
{ label: "Emergency", href: "#services" },
|
||||
],
|
||||
id: "1", badge: "Service Call", price: "$99", subtitle: "Initial inspection and diagnosis", features: [
|
||||
"Complete electrical inspection", "Problem diagnosis", "Written quote for repairs", "Same-day service available"],
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "/about" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
{ label: "Free Quote", href: "#contact" },
|
||||
],
|
||||
id: "2", badge: "Standard Installation", price: "$149-$399", subtitle: "Typical residential installations", features: [
|
||||
"Light switch installation", "Outlet installation", "Ceiling fan installation", "Basic wiring work"],
|
||||
},
|
||||
{
|
||||
title: "Contact", items: [
|
||||
{ label: "Phone: 0418 527 497", href: "tel:0418527497" },
|
||||
{ label: "Geelong, VIC 3220", href: "#" },
|
||||
{ label: "Mon-Fri by Appointment", href: "#" },
|
||||
],
|
||||
id: "3", badge: "Premium Installation", price: "$499-$1,299", subtitle: "Complex electrical work", features: [
|
||||
"Panel upgrades", "Whole-house rewiring", "Commercial installations", "Priority support"],
|
||||
},
|
||||
{
|
||||
id: "4", badge: "Lighting Installation", price: "$250", subtitle: "Professional lighting solutions", features: [
|
||||
"LED lighting installation", "Smart home lighting setup", "Outdoor lighting", "Landscape lighting"],
|
||||
},
|
||||
{
|
||||
id: "5", badge: "Lighting Service", price: "By Quote", subtitle: "Custom lighting projects", features: [
|
||||
"Custom design consultation", "Commercial lighting", "Specialized installations", "Energy-efficient solutions"],
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="text-shift"
|
||||
defaultButtonVariant="hover-magnetic"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="rounded"
|
||||
contentWidth="smallMedium"
|
||||
sizing="mediumLarge"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="primary-glow"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="none"
|
||||
cardStyle="solid"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="solid"
|
||||
headingFontWeight="light"
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
brandName="M&T Kelly"
|
||||
navItems={navItems}
|
||||
button={{
|
||||
text: "Call 0418 527 497", href: "tel:0418527497"}}
|
||||
animateOnLoad={true}
|
||||
/>
|
||||
</div>
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Services", id: "#services" },
|
||||
{ name: "Pricing", id: "#pricing" },
|
||||
{ name: "Contact", id: "#contact" },
|
||||
]}
|
||||
brandName="M&T Kelly"
|
||||
button={{ text: "Get Quote", href: "#contact" }}
|
||||
/>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCarouselLogo
|
||||
logoText="M&T Kelly"
|
||||
description="Geelong's Trusted Local Electrician. Domestic & Commercial Wiring Specialists"
|
||||
buttons={[
|
||||
{ text: "Call 0418 527 497", href: "tel:0418527497" },
|
||||
{ text: "Request a Free Quote", href: "#contact" },
|
||||
<HeroBillboardGallery
|
||||
background={{ variant: "radial-gradient" }}
|
||||
title="Professional Electrical Services in Geelong"
|
||||
description="Expert solutions for residential, commercial, and emergency electrical needs. Licensed, insured, and trusted by the community."
|
||||
tag="Electrical Excellence"
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "/images/hero1.jpg", imageAlt: "Professional electrician at work"},
|
||||
{
|
||||
imageSrc: "/images/hero2.jpg", imageAlt: "Electrical panel installation"},
|
||||
{
|
||||
imageSrc: "/images/hero3.jpg", imageAlt: "Solar panel system"},
|
||||
{
|
||||
imageSrc: "/images/hero4.jpg", imageAlt: "Modern lighting installation"},
|
||||
{
|
||||
imageSrc: "/images/hero5.jpg", imageAlt: "Emergency service team"},
|
||||
]}
|
||||
buttons={[
|
||||
{ text: "Book Service", href: "#contact" },
|
||||
{ text: "Learn More", href: "#services" },
|
||||
]}
|
||||
slides={heroSlides}
|
||||
autoplayDelay={5000}
|
||||
showDimOverlay={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="highlights" data-section="highlights">
|
||||
<FeatureCardSeven
|
||||
features={features}
|
||||
title="Why Choose M&T Kelly?"
|
||||
description="Owner-operated, locally owned, and Australian-owned. We bring personal attention and expertise to every project."
|
||||
tag="Services"
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
tag="About Us"
|
||||
title="Local Expertise You Can Trust"
|
||||
description="M&T Kelly Electrical"
|
||||
subdescription="Geelong, Victoria"
|
||||
icon={Zap}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/chicago-navy-pier_649448-1627.jpg"
|
||||
imageAlt="Geelong waterfront - where we serve"
|
||||
mediaAnimation="slide-up"
|
||||
<TextAbout
|
||||
tag="About M&T Kelly"
|
||||
title="Delivering reliable electrical expertise to Geelong since 2010. We're committed to safety, quality, and customer satisfaction on every project."
|
||||
useInvertedBackground={true}
|
||||
buttons={[
|
||||
{ text: "Contact Us", href: "#contact" },
|
||||
{ text: "View Services", href: "#services" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<ProductCardFour
|
||||
products={products}
|
||||
<FeatureCardSix
|
||||
title="Our Services"
|
||||
description="Professional electrical solutions for every need"
|
||||
tag="Complete Solutions"
|
||||
animationType="blur-reveal"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
description="Comprehensive electrical solutions tailored to your needs"
|
||||
tag="What We Offer"
|
||||
features={services}
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSix
|
||||
testimonials={testimonials}
|
||||
title="What Our Clients Say"
|
||||
description="Real feedback from real customers across Geelong"
|
||||
tag="Testimonials"
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardOne
|
||||
plans={pricingPlans}
|
||||
title="Service Pricing"
|
||||
description="Transparent pricing for all your electrical service needs"
|
||||
tag="Pricing"
|
||||
textboxLayout="default"
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
speed={40}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
text="Ready for professional electrical work? Get your free quote today. Contact M&T Kelly and experience local expertise."
|
||||
animationType="entrance-slide"
|
||||
buttons={[
|
||||
{ text: "Call Now: 0418 527 497", href: "tel:0418527497" },
|
||||
{ text: "Request Quote", href: "#quote-form" },
|
||||
]}
|
||||
background={{ variant: "plain" }}
|
||||
useInvertedBackground={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
logoText="M&T Kelly"
|
||||
copyrightText="© 2025 M&T Kelly Electrical. All rights reserved."
|
||||
columns={footerColumns}
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
tag="Get In Touch"
|
||||
title="Ready for Professional Electrical Work?"
|
||||
description="Contact M&T Kelly today for a free quote. Available for emergency services 24/7."
|
||||
background={{ variant: "rotated-rays-animated" }}
|
||||
useInvertedBackground={false}
|
||||
buttonText="Request Quote"
|
||||
inputPlaceholder="your.email@example.com"
|
||||
onSubmit={(email) => console.log("Email submitted:", email)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<footer>
|
||||
<FooterCard
|
||||
logoText="M&T Kelly"
|
||||
copyrightText="© 2025 M&T Kelly Electrical Services. All rights reserved."
|
||||
socialLinks={[
|
||||
{
|
||||
icon: Phone,
|
||||
href: "tel:+61-3-xxxx-xxxx", ariaLabel: "Call us"},
|
||||
{
|
||||
icon: Mail,
|
||||
href: "mailto:info@mtkelly.com.au", ariaLabel: "Email us"},
|
||||
{
|
||||
icon: MapPin,
|
||||
href: "https://maps.google.com", ariaLabel: "Find us on maps"},
|
||||
]}
|
||||
/>
|
||||
</footer>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
export default page;
|
||||
|
||||
Reference in New Issue
Block a user