Files
354e60f0-efa6-486f-bbd4-71f…/src/app/page.tsx
2026-03-10 07:05:51 +00:00

203 lines
8.2 KiB
TypeScript

"use client";
import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
import HeroLogoBillboard from "@/components/sections/hero/HeroLogoBillboard";
import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
import FeatureCardSix from "@/components/sections/feature/FeatureCardSix";
import InlineImageSplitTextAbout from "@/components/sections/about/InlineImageSplitTextAbout";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import TestimonialCardFifteen from "@/components/sections/testimonial/TestimonialCardFifteen";
import ContactText from "@/components/sections/contact/ContactText";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
import { Star, Users, Award } from "lucide-react";
export default function HomePage() {
const navItems = [
{ name: "Home", id: "home" },
{ name: "Services", id: "services" },
{ name: "About", id: "about" },
{ name: "Reviews", id: "reviews" },
{ name: "Contact", id: "contact" },
];
return (
<ThemeProvider
defaultButtonVariant="shift-hover"
defaultTextAnimation="reveal-blur"
borderRadius="rounded"
contentWidth="mediumSmall"
sizing="mediumLarge"
background="circleGradient"
cardStyle="gradient-mesh"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="glass"
headingFontWeight="semibold"
>
{/* Navigation */}
<div id="nav" data-section="nav">
<NavbarStyleCentered
brandName="DJ and Sons"
navItems={navItems}
button={{
text: "Call Now", href: "tel:0401022777"}}
/>
</div>
{/* Hero Section */}
<div id="hero" data-section="hero">
<HeroLogoBillboard
logoText="DJ and Sons Automotive"
description="Your trusted local mechanic in Para Hills West. Honest advice, fair pricing, and quality workmanship from a family-run automotive workshop."
buttons={[
{
text: "Call Now", href: "tel:0401022777"},
{
text: "Book a Service"},
]}
buttonAnimation="slide-up"
background={{
variant: "plain"}}
imageSrc="http://img.b2bpic.net/free-photo/repairmen-fix-car-together_482257-102916.jpg"
imageAlt="Professional automotive workshop"
frameStyle="card"
mediaAnimation="slide-up"
/>
</div>
{/* Trust & Reviews Section */}
<div id="trust" data-section="trust">
<MetricCardThree
metrics={[
{
id: "1", icon: Star,
title: "Rating", value: "4.9/5"},
{
id: "2", icon: Users,
title: "Happy Customers", value: "94+"},
{
id: "3", icon: Award,
title: "Years Experience", value: "15+"},
]}
title="Trusted by Northern Adelaide"
description="Join hundreds of satisfied customers who rely on DJ and Sons for honest, reliable service"
tag="Social Proof"
textboxLayout="default"
useInvertedBackground={false}
animationType="slide-up"
/>
</div>
{/* Services Overview - Home Page Summary */}
<div id="services-home" data-section="services-home">
<FeatureCardSix
features={[
{
id: 1,
title: "Logbook Servicing", description: "Dealer-standard servicing without dealership prices. Regular maintenance to keep your vehicle running smoothly.", imageSrc: "http://img.b2bpic.net/free-photo/serious-businessman-manager-stands-front-modern-silver-colored-car-with-paper-documents-hands_146671-16506.jpg?_wi=1"},
{
id: 2,
title: "Brake Repairs", description: "Professional brake inspections, pad replacements, and rotor servicing for safety and performance.", imageSrc: "http://img.b2bpic.net/free-photo/male-mechanics-working-together-car-shop_23-2150376986.jpg?_wi=1"},
{
id: 3,
title: "Air Conditioning", description: "AC regassing, diagnostics, and repairs to keep your cabin comfortable year-round.", imageSrc: "http://img.b2bpic.net/free-photo/mechanic-showing-customer-problem-with-car_1170-1368.jpg?_wi=1"},
]}
title="Our Services"
description="Comprehensive automotive repair and maintenance services for all vehicle types"
tag="What We Offer"
textboxLayout="default"
useInvertedBackground={false}
buttons={[
{
text: "View All Services", href: "/services"},
]}
buttonAnimation="slide-up"
/>
</div>
{/* About Section */}
<div id="about" data-section="about">
<InlineImageSplitTextAbout
heading={[
{
type: "text", content: "A Family Business Built on"},
{
type: "text", content: "Trust and Honesty"},
]}
useInvertedBackground={false}
buttons={[
{
text: "Learn More", href: "/services"},
]}
buttonAnimation="slide-up"
/>
</div>
{/* Local Service Areas */}
<div id="local-areas" data-section="local-areas">
<SocialProofOne
title="Proudly Serving Northern Adelaide"
description="We service customers across these suburbs and surrounding areas"
tag="Service Areas"
textboxLayout="default"
useInvertedBackground={false}
names={[
"Para Hills", "Salisbury", "Ingle Farm", "Pooraka", "Modbury", "Mawson Lakes"]}
speed={40}
showCard={true}
/>
</div>
{/* Testimonials */}
<div id="testimonials" data-section="testimonials">
<TestimonialCardFifteen
testimonial="Very reasonable pricing, very thorough and just all round great service. No pressure, no upselling — just trustworthy advice and quality workmanship. Outstanding customer service and an honest mechanic you can rely on."
rating={5}
author="Local Vehicle Owner"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/salesman-car-showroom_1303-13625.jpg", alt: "Customer 1"},
{
src: "http://img.b2bpic.net/free-photo/my-big-dream-is-working-big-company_329181-11421.jpg", alt: "Customer 2"},
{
src: "http://img.b2bpic.net/free-photo/man-with-thumb-up_1368-6368.jpg", alt: "Customer 3"},
{
src: "http://img.b2bpic.net/free-photo/front-view-woman-looking-camera-office_23-2148218515.jpg", alt: "Customer 4"},
]}
useInvertedBackground={false}
ratingAnimation="slide-up"
avatarsAnimation="slide-up"
/>
</div>
{/* Call to Action */}
<div id="contact-cta" data-section="contact-cta">
<ContactText
text="Ready to get your vehicle serviced by honest professionals? Contact DJ and Sons today and experience the difference quality service makes."
animationType="entrance-slide"
buttons={[
{
text: "Call 0401 022 777", href: "tel:0401022777"},
{
text: "Book Service"},
]}
background={{
variant: "plain"}}
useInvertedBackground={false}
/>
</div>
{/* Footer */}
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="DJ and Sons"
leftLink={{
text: "Privacy Policy", href: "#"}}
rightLink={{
text: "Terms of Service", href: "#"}}
/>
</div>
</ThemeProvider>
);
}