Merge version_1 into main
Merge version_1 into main
This commit was merged in pull request #2.
This commit is contained in:
228
src/app/page.tsx
228
src/app/page.tsx
@@ -29,22 +29,10 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "home",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Services",
|
||||
id: "services",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "home" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Metro Auto Repair"
|
||||
/>
|
||||
@@ -52,109 +40,27 @@ export default function LandingPage() {
|
||||
|
||||
<div id="home" data-section="home">
|
||||
<HeroBillboardTestimonial
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Reliable Repairs. Honest Service. Every Time."
|
||||
description="Your trusted neighborhood auto repair shop in Gulshan-e-Iqbal, Karachi. Serving all makes and models with expert care."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Ali Khan",
|
||||
handle: "@alikhan",
|
||||
testimonial: "Excellent service and very transparent pricing. My go-to shop for routine maintenance.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-automobile-mechanic-composition_23-2147881684.jpg?_wi=1",
|
||||
imageAlt: "auto repair shop interior",
|
||||
},
|
||||
{
|
||||
name: "Sara Ahmed",
|
||||
handle: "@saraahmed",
|
||||
testimonial: "Quick turnaround and skilled technicians. They fixed my engine issues perfectly.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/mechanic-wiping-his-hands-with-napkin_1170-1551.jpg?_wi=1",
|
||||
imageAlt: "friendly experienced mechanic portrait",
|
||||
},
|
||||
{
|
||||
name: "Zaid Mahmood",
|
||||
handle: "@zaidm",
|
||||
testimonial: "Honest service. They don't try to oversell unneeded parts. Highly recommended.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-african-american-auto-repairman-talking-customer-workshop_637285-8626.jpg?_wi=1",
|
||||
imageAlt: "engine diagnostic scan tool",
|
||||
},
|
||||
{
|
||||
name: "Fatima Rizvi",
|
||||
handle: "@fatimar",
|
||||
testimonial: "The staff is professional and very knowledgeable about all car makes.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-mechanic-work-his-garage_146671-19701.jpg?_wi=1",
|
||||
imageAlt: "oil change service car",
|
||||
},
|
||||
{
|
||||
name: "Omar Siddiqui",
|
||||
handle: "@omarsid",
|
||||
testimonial: "Superb brake service. My car feels brand new again!",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/car-repairman-wearing-white-uniform-standing-holding-wrench-that-is-essential-tool-mechanic-with-laptop-checking-engine_1150-16590.jpg?_wi=1",
|
||||
imageAlt: "car battery testing tool",
|
||||
},
|
||||
{ name: "Ali Khan", handle: "@alikhan", testimonial: "Excellent service and very transparent pricing. My go-to shop for routine maintenance.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/modern-automobile-mechanic-composition_23-2147881684.jpg", imageAlt: "auto repair shop interior" },
|
||||
{ name: "Sara Ahmed", handle: "@saraahmed", testimonial: "Quick turnaround and skilled technicians. They fixed my engine issues perfectly.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/mechanic-wiping-his-hands-with-napkin_1170-1551.jpg", imageAlt: "friendly experienced mechanic portrait" },
|
||||
{ name: "Zaid Mahmood", handle: "@zaidm", testimonial: "Honest service. They don't try to oversell unneeded parts. Highly recommended.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/happy-african-american-auto-repairman-talking-customer-workshop_637285-8626.jpg", imageAlt: "engine diagnostic scan tool" },
|
||||
{ name: "Fatima Rizvi", handle: "@fatimar", testimonial: "The staff is professional and very knowledgeable about all car makes.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-mechanic-work-his-garage_146671-19701.jpg", imageAlt: "oil change service car" },
|
||||
{ name: "Omar Siddiqui", handle: "@omarsid", testimonial: "Superb brake service. My car feels brand new again!", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/car-repairman-wearing-white-uniform-standing-holding-wrench-that-is-essential-tool-mechanic-with-laptop-checking-engine_1150-16590.jpg", imageAlt: "car battery testing tool" }
|
||||
]}
|
||||
buttons={[
|
||||
{
|
||||
text: "Book Appointment",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
text: "Call Now",
|
||||
href: "tel:+923001234567",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/modern-automobile-mechanic-composition_23-2147881684.jpg?_wi=2"
|
||||
buttons={[{ text: "Book Appointment", href: "#contact" }, { text: "Call Now", href: "tel:+923001234567" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/modern-automobile-mechanic-composition_23-2147881684.jpg"
|
||||
imageAlt="Professional auto repair shop"
|
||||
avatars={[
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/portrait-mechanic-work-his-garage_146671-19701.jpg",
|
||||
alt: "Mechanic",
|
||||
},
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/happy-african-american-auto-repairman-talking-customer-workshop_637285-8626.jpg",
|
||||
alt: "Customer",
|
||||
},
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/modern-automobile-mechanic-composition_23-2147881684.jpg",
|
||||
alt: "Mechanic",
|
||||
},
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/mechanic-wiping-his-hands-with-napkin_1170-1551.jpg",
|
||||
alt: "Mechanic",
|
||||
},
|
||||
{
|
||||
src: "https://img.b2bpic.net/free-photo/car-repairman-wearing-white-uniform-standing-holding-wrench-that-is-essential-tool-mechanic-with-laptop-checking-engine_1150-16590.jpg",
|
||||
alt: "Technician",
|
||||
},
|
||||
]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "Engine Diagnostics",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Oil Changes",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Battery Services",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Brake Repairs",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Full Maintenance",
|
||||
},
|
||||
{ src: "https://img.b2bpic.net/free-photo/portrait-mechanic-work-his-garage_146671-19701.jpg", alt: "Mechanic" },
|
||||
{ src: "https://img.b2bpic.net/free-photo/happy-african-american-auto-repairman-talking-customer-workshop_637285-8626.jpg", alt: "Customer" },
|
||||
{ src: "https://img.b2bpic.net/free-photo/modern-automobile-mechanic-composition_23-2147881684.jpg", alt: "Mechanic" },
|
||||
{ src: "https://img.b2bpic.net/free-photo/mechanic-wiping-his-hands-with-napkin_1170-1551.jpg", alt: "Mechanic" },
|
||||
{ src: "https://img.b2bpic.net/free-photo/car-repairman-wearing-white-uniform-standing-holding-wrench-that-is-essential-tool-mechanic-with-laptop-checking-engine_1150-16590.jpg", alt: "Technician" }
|
||||
]}
|
||||
marqueeItems={[{ type: "text", text: "Engine Diagnostics" }, { type: "text", text: "Oil Changes" }, { type: "text", text: "Battery Services" }, { type: "text", text: "Brake Repairs" }, { type: "text", text: "Full Maintenance" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -165,7 +71,7 @@ export default function LandingPage() {
|
||||
title="Dependable and Affordable Service"
|
||||
description="At Metro Auto Repair, we pride ourselves on transparency, quick turnaround times, and professional results. Located in the heart of Gulshan-e-Iqbal, Karachi, we treat every car like our own."
|
||||
subdescription="With years of hands-on experience, our skilled technicians ensure your vehicle receives the best care, whether it's routine maintenance or complex engine diagnostics."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/mechanic-wiping-his-hands-with-napkin_1170-1551.jpg?_wi=2"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/mechanic-wiping-his-hands-with-napkin_1170-1551.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
icon={Wrench}
|
||||
/>
|
||||
@@ -178,65 +84,33 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Engine Diagnostics",
|
||||
description: "Advanced scanning tools to identify and fix engine issues efficiently.",
|
||||
icon: Settings,
|
||||
title: "Engine Diagnostics", description: "Advanced scanning tools to identify and fix engine issues efficiently.", icon: Settings,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-african-american-auto-repairman-talking-customer-workshop_637285-8626.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-african-american-auto-repairman-talking-customer-workshop_637285-8626.jpg?_wi=3",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-hard-disk-with-blue-light_23-2149413365.jpg?_wi=1",
|
||||
imageAlt: "car brake pad service",
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/happy-african-american-auto-repairman-talking-customer-workshop_637285-8626.jpg" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/happy-african-american-auto-repairman-talking-customer-workshop_637285-8626.jpg" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Oil Change",
|
||||
description: "Keep your engine running smoothly with high-quality oil and filters.",
|
||||
icon: Droplet,
|
||||
title: "Oil Change", description: "Keep your engine running smoothly with high-quality oil and filters.", icon: Droplet,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-mechanic-work-his-garage_146671-19701.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-mechanic-work-his-garage_146671-19701.jpg?_wi=3",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-automobile-mechanic-composition_23-2147881684.jpg?_wi=3",
|
||||
imageAlt: "auto repair shop interior",
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/portrait-mechanic-work-his-garage_146671-19701.jpg" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/portrait-mechanic-work-his-garage_146671-19701.jpg" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Battery Services",
|
||||
description: "Electrical diagnostics, battery checks, and reliable replacements.",
|
||||
icon: Zap,
|
||||
title: "Battery Services", description: "Electrical diagnostics, battery checks, and reliable replacements.", icon: Zap,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/car-repairman-wearing-white-uniform-standing-holding-wrench-that-is-essential-tool-mechanic-with-laptop-checking-engine_1150-16590.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/car-repairman-wearing-white-uniform-standing-holding-wrench-that-is-essential-tool-mechanic-with-laptop-checking-engine_1150-16590.jpg?_wi=3",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/mechanic-wiping-his-hands-with-napkin_1170-1551.jpg?_wi=3",
|
||||
imageAlt: "friendly experienced mechanic portrait",
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/car-repairman-wearing-white-uniform-standing-holding-wrench-that-is-essential-tool-mechanic-with-laptop-checking-engine_1150-16590.jpg" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/car-repairman-wearing-white-uniform-standing-holding-wrench-that-is-essential-tool-mechanic-with-laptop-checking-engine_1150-16590.jpg" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Brake Services",
|
||||
description: "Precision brake and suspension service for total road safety.",
|
||||
icon: ShieldCheck,
|
||||
title: "Brake Services", description: "Precision brake and suspension service for total road safety.", icon: ShieldCheck,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-hard-disk-with-blue-light_23-2149413365.jpg?_wi=2",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-hard-disk-with-blue-light_23-2149413365.jpg?_wi=3",
|
||||
},
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/happy-african-american-auto-repairman-talking-customer-workshop_637285-8626.jpg?_wi=4",
|
||||
imageAlt: "engine diagnostic scan tool",
|
||||
},
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/top-view-hard-disk-with-blue-light_23-2149413365.jpg" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/top-view-hard-disk-with-blue-light_23-2149413365.jpg" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
title="Our Services"
|
||||
description="Comprehensive auto repair solutions for your vehicle's performance, safety, and longevity."
|
||||
@@ -248,25 +122,23 @@ export default function LandingPage() {
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Customer Reviews"
|
||||
description="Hear what our clients say about our services."
|
||||
testimonials={[
|
||||
{ name: "Ali Khan", testimonial: "Excellent service!", rating: 5 },
|
||||
{ name: "Sara Ahmed", testimonial: "Very professional.", rating: 5 }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
text="Ready to get your car back on the road? Book your appointment today or give us a call for a consultation."
|
||||
buttons={[
|
||||
{
|
||||
text: "Call Now: +92 300 123 4567",
|
||||
href: "tel:+923001234567",
|
||||
},
|
||||
{
|
||||
text: "Email Us",
|
||||
href: "mailto:info@metroautorepair.com",
|
||||
},
|
||||
{ text: "Call Now: +92 300 123 4567", href: "tel:+923001234567" },
|
||||
{ text: "Email Us", href: "mailto:info@metroautorepair.com" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -274,14 +146,8 @@ export default function LandingPage() {
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Metro Auto Repair"
|
||||
leftLink={{
|
||||
text: "© 2024 Metro Auto Repair",
|
||||
href: "#",
|
||||
}}
|
||||
rightLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
leftLink={{ text: "© 2024 Metro Auto Repair", href: "#" }}
|
||||
rightLink={{ text: "Privacy Policy", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
|
||||
Reference in New Issue
Block a user