Merge version_1 into main #1
107
src/app/page.tsx
107
src/app/page.tsx
@@ -21,8 +21,7 @@ export default function HomePage() {
|
||||
|
||||
const footerColumns = [
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
title: "Services", items: [
|
||||
{ label: "Brake Repair", href: "/services" },
|
||||
{ label: "Engine Diagnostics", href: "/services" },
|
||||
{ label: "Oil Changes", href: "/services" },
|
||||
@@ -30,16 +29,14 @@ export default function HomePage() {
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "/#about" },
|
||||
{ label: "Contact", href: "/#contact" },
|
||||
{ label: "Testimonials", href: "/#testimonial" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
title: "Contact", items: [
|
||||
{ label: "124 Nevada St, El Segundo, CA 90245", href: "#" },
|
||||
{ label: "(310) 322-3482", href: "tel:(310)322-3482" },
|
||||
{ label: "Service Request", href: "/#contact" },
|
||||
@@ -54,7 +51,7 @@ export default function HomePage() {
|
||||
borderRadius="soft"
|
||||
contentWidth="compact"
|
||||
sizing="medium"
|
||||
background="noise"
|
||||
background="circleGradient"
|
||||
cardStyle="subtle-shadow"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="layered"
|
||||
@@ -73,7 +70,7 @@ export default function HomePage() {
|
||||
<HeroSplit
|
||||
title="Reliable Auto Repair in El Segundo"
|
||||
description="Honest mechanics. Quality repairs. Fast service."
|
||||
background={{ variant: "noise" }}
|
||||
background={{ variant: "glowing-orb" }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/experienced-middle-aged-truck-mechanics-holding-parts-tools-repair-shop-by-truck_342744-1287.jpg"
|
||||
imageAlt="Modern auto repair garage with professional mechanics"
|
||||
mediaAnimation="slide-up"
|
||||
@@ -98,20 +95,11 @@ export default function HomePage() {
|
||||
description="Comprehensive automotive solutions for all your vehicle maintenance and repair needs. We service all makes and models with expertise and efficiency."
|
||||
negativeCard={{
|
||||
items: [
|
||||
"Unreliable technicians",
|
||||
"Hidden costs and surprises",
|
||||
"Long wait times",
|
||||
],
|
||||
"Unreliable technicians", "Hidden costs and surprises", "Long wait times"],
|
||||
}}
|
||||
positiveCard={{
|
||||
items: [
|
||||
"Experienced certified mechanics",
|
||||
"Honest transparent pricing",
|
||||
"Fast reliable turnaround",
|
||||
"All vehicle makes and models",
|
||||
"Advanced diagnostic equipment",
|
||||
"Professional quality work",
|
||||
],
|
||||
"Experienced certified mechanics", "Honest transparent pricing", "Fast reliable turnaround", "All vehicle makes and models", "Advanced diagnostic equipment", "Professional quality work"],
|
||||
}}
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
@@ -123,55 +111,22 @@ export default function HomePage() {
|
||||
<TestimonialCardFive
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Robert Martinez, Vehicle Owner",
|
||||
date: "Date: 15 November 2024",
|
||||
title: "Honest mechanics you can actually trust",
|
||||
quote:
|
||||
"Joe and his team are fantastic. Honest, fast, and very knowledgeable. They explained everything clearly and got my car running perfectly again. It's hard to find a mechanic you can trust, but this shop definitely delivers.",
|
||||
tag: "Verified Customer",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/benchman-fixing-detail_114579-2803.jpg",
|
||||
avatarAlt: "Robert Martinez",
|
||||
},
|
||||
id: "1", name: "Robert Martinez, Vehicle Owner", date: "Date: 15 November 2024", title: "Honest mechanics you can actually trust", quote:
|
||||
"Joe and his team are fantastic. Honest, fast, and very knowledgeable. They explained everything clearly and got my car running perfectly again. It's hard to find a mechanic you can trust, but this shop definitely delivers.", tag: "Verified Customer", avatarSrc: "http://img.b2bpic.net/free-photo/benchman-fixing-detail_114579-2803.jpg", avatarAlt: "Robert Martinez"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Sarah Chen, Small Business Owner",
|
||||
date: "Date: 08 October 2024",
|
||||
title: "Quick turnaround and expert service",
|
||||
quote:
|
||||
"My fleet vehicles are maintained here regularly. The team understands our business needs and always prioritizes quality. Their diagnostic work is thorough and they never recommend unnecessary repairs.",
|
||||
tag: "Fleet Customer",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/benchman-fixing-detail_114579-2803.jpg",
|
||||
avatarAlt: "Sarah Chen",
|
||||
},
|
||||
id: "2", name: "Sarah Chen, Small Business Owner", date: "Date: 08 October 2024", title: "Quick turnaround and expert service", quote:
|
||||
"My fleet vehicles are maintained here regularly. The team understands our business needs and always prioritizes quality. Their diagnostic work is thorough and they never recommend unnecessary repairs.", tag: "Fleet Customer", avatarSrc: "http://img.b2bpic.net/free-photo/benchman-fixing-detail_114579-2803.jpg", avatarAlt: "Sarah Chen"},
|
||||
{
|
||||
id: "3",
|
||||
name: "Michael Rodriguez, Vehicle Enthusiast",
|
||||
date: "Date: 22 September 2024",
|
||||
title: "Professional work at fair prices",
|
||||
quote:
|
||||
"I've taken my car to many shops over the years. Joe Complete stands out for their professionalism and fair pricing. They fixed my brake issue properly and my car feels like new.",
|
||||
tag: "Regular Customer",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/benchman-fixing-detail_114579-2803.jpg",
|
||||
avatarAlt: "Michael Rodriguez",
|
||||
},
|
||||
id: "3", name: "Michael Rodriguez, Vehicle Enthusiast", date: "Date: 22 September 2024", title: "Professional work at fair prices", quote:
|
||||
"I've taken my car to many shops over the years. Joe Complete stands out for their professionalism and fair pricing. They fixed my brake issue properly and my car feels like new.", tag: "Regular Customer", avatarSrc: "http://img.b2bpic.net/free-photo/benchman-fixing-detail_114579-2803.jpg", avatarAlt: "Michael Rodriguez"},
|
||||
{
|
||||
id: "4",
|
||||
name: "Jennifer Lee, Commuter",
|
||||
date: "Date: 30 August 2024",
|
||||
title: "Got me back on the road quickly",
|
||||
quote:
|
||||
"My transmission was failing and I was worried about costs. Joe explained the options clearly and did quality work at a reasonable price. I'm driving with confidence again.",
|
||||
tag: "Verified Customer",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/benchman-fixing-detail_114579-2803.jpg",
|
||||
avatarAlt: "Jennifer Lee",
|
||||
},
|
||||
id: "4", name: "Jennifer Lee, Commuter", date: "Date: 30 August 2024", title: "Got me back on the road quickly", quote:
|
||||
"My transmission was failing and I was worried about costs. Joe explained the options clearly and did quality work at a reasonable price. I'm driving with confidence again.", tag: "Verified Customer", avatarSrc: "http://img.b2bpic.net/free-photo/benchman-fixing-detail_114579-2803.jpg", avatarAlt: "Jennifer Lee"},
|
||||
]}
|
||||
title="What Our Customers Say"
|
||||
description="Real testimonials from satisfied vehicle owners and businesses we've served"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
animationType="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -180,35 +135,21 @@ export default function HomePage() {
|
||||
ctaTitle="Need your car checked today?"
|
||||
ctaDescription="Get professional diagnostics and quality repairs. Call now to schedule your appointment with our experienced team."
|
||||
ctaButton={{
|
||||
text: "Call Now",
|
||||
href: "tel:(310)322-3482",
|
||||
}}
|
||||
text: "Call Now", href: "tel:(310)322-3482"}}
|
||||
ctaIcon={Phone}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "What types of vehicles do you service?",
|
||||
content:
|
||||
"We service all makes and models including domestic and imported vehicles. From routine maintenance to major repairs, our experienced mechanics handle it all with expertise.",
|
||||
},
|
||||
id: "1", title: "What types of vehicles do you service?", content:
|
||||
"We service all makes and models including domestic and imported vehicles. From routine maintenance to major repairs, our experienced mechanics handle it all with expertise."},
|
||||
{
|
||||
id: "2",
|
||||
title: "How long do repairs typically take?",
|
||||
content:
|
||||
"Most repairs are completed within 24-48 hours. Simple maintenance like oil changes can often be done same-day. We'll always give you an honest timeline upfront.",
|
||||
},
|
||||
id: "2", title: "How long do repairs typically take?", content:
|
||||
"Most repairs are completed within 24-48 hours. Simple maintenance like oil changes can often be done same-day. We'll always give you an honest timeline upfront."},
|
||||
{
|
||||
id: "3",
|
||||
title: "Do you offer warranty on repairs?",
|
||||
content:
|
||||
"Yes, we stand behind our work. All repairs include a warranty period so you can have peace of mind. Ask about the specific warranty on your service.",
|
||||
},
|
||||
id: "3", title: "Do you offer warranty on repairs?", content:
|
||||
"Yes, we stand behind our work. All repairs include a warranty period so you can have peace of mind. Ask about the specific warranty on your service."},
|
||||
{
|
||||
id: "4",
|
||||
title: "How do you determine fair pricing?",
|
||||
content:
|
||||
"We diagnose issues thoroughly and provide transparent estimates. We never recommend unnecessary work. You'll always know what you're paying for before we begin.",
|
||||
},
|
||||
id: "4", title: "How do you determine fair pricing?", content:
|
||||
"We diagnose issues thoroughly and provide transparent estimates. We never recommend unnecessary work. You'll always know what you're paying for before we begin."},
|
||||
]}
|
||||
useInvertedBackground={true}
|
||||
animationType="slide-up"
|
||||
|
||||
@@ -19,8 +19,7 @@ export default function ServicesPage() {
|
||||
|
||||
const footerColumns = [
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
title: "Services", items: [
|
||||
{ label: "Brake Repair", href: "#services" },
|
||||
{ label: "Engine Diagnostics", href: "#services" },
|
||||
{ label: "Oil Changes", href: "#services" },
|
||||
@@ -28,16 +27,14 @@ export default function ServicesPage() {
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "/" },
|
||||
{ label: "Contact", href: "#contact" },
|
||||
{ label: "Testimonials", href: "/" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
title: "Contact", items: [
|
||||
{ label: "124 Nevada St, El Segundo, CA 90245", href: "#" },
|
||||
{ label: "(310) 322-3482", href: "tel:(310)322-3482" },
|
||||
{ label: "Service Request", href: "#contact" },
|
||||
@@ -52,7 +49,7 @@ export default function ServicesPage() {
|
||||
borderRadius="soft"
|
||||
contentWidth="compact"
|
||||
sizing="medium"
|
||||
background="noise"
|
||||
background="circleGradient"
|
||||
cardStyle="subtle-shadow"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="layered"
|
||||
@@ -71,7 +68,7 @@ export default function ServicesPage() {
|
||||
<HeroSplit
|
||||
title="Our Professional Services"
|
||||
description="From routine maintenance to complex repairs, we handle everything your vehicle needs with expertise and care."
|
||||
background={{ variant: "noise" }}
|
||||
background={{ variant: "glowing-orb" }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/african-american-auto-mechanic-his-coworker-communicating-with-their-manager-repair-shop_637285-4233.jpg"
|
||||
imageAlt="Automotive service expertise technicians"
|
||||
mediaAnimation="slide-up"
|
||||
@@ -87,20 +84,11 @@ export default function ServicesPage() {
|
||||
description="We provide a full range of automotive services to keep your vehicle running smoothly and safely."
|
||||
negativeCard={{
|
||||
items: [
|
||||
"Delayed service appointments",
|
||||
"Lack of diagnostic clarity",
|
||||
"Uncomfortable waiting areas",
|
||||
],
|
||||
"Delayed service appointments", "Lack of diagnostic clarity", "Uncomfortable waiting areas"],
|
||||
}}
|
||||
positiveCard={{
|
||||
items: [
|
||||
"Quick appointment availability",
|
||||
"Detailed diagnostic reports",
|
||||
"Comfortable customer lounge",
|
||||
"Mobile friendly service booking",
|
||||
"Online service history tracking",
|
||||
"Warranty on all repairs",
|
||||
],
|
||||
"Quick appointment availability", "Detailed diagnostic reports", "Comfortable customer lounge", "Mobile friendly service booking", "Online service history tracking", "Warranty on all repairs"],
|
||||
}}
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
@@ -113,35 +101,21 @@ export default function ServicesPage() {
|
||||
ctaTitle="Ready to get your service done?"
|
||||
ctaDescription="Contact us today to schedule your appointment with our experienced team of certified mechanics."
|
||||
ctaButton={{
|
||||
text: "Book Service",
|
||||
href: "tel:(310)322-3482",
|
||||
}}
|
||||
text: "Book Service", href: "tel:(310)322-3482"}}
|
||||
ctaIcon={Phone}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "What is included in routine maintenance?",
|
||||
content:
|
||||
"Routine maintenance includes oil changes, fluid top-ups, filter replacements, tire rotation, brake inspection, and battery check. We'll perform a comprehensive vehicle health assessment.",
|
||||
},
|
||||
id: "1", title: "What is included in routine maintenance?", content:
|
||||
"Routine maintenance includes oil changes, fluid top-ups, filter replacements, tire rotation, brake inspection, and battery check. We'll perform a comprehensive vehicle health assessment."},
|
||||
{
|
||||
id: "2",
|
||||
title: "How often should I service my vehicle?",
|
||||
content:
|
||||
"Most vehicles benefit from service every 6 months or 10,000 kilometers, whichever comes first. We recommend checking your vehicle's manual for specific intervals.",
|
||||
},
|
||||
id: "2", title: "How often should I service my vehicle?", content:
|
||||
"Most vehicles benefit from service every 6 months or 10,000 kilometers, whichever comes first. We recommend checking your vehicle's manual for specific intervals."},
|
||||
{
|
||||
id: "3",
|
||||
title: "Do you provide emergency repair services?",
|
||||
content:
|
||||
"Yes, we handle emergency repairs. Contact us immediately if your vehicle breaks down. We prioritize safety-critical issues like brake and steering problems.",
|
||||
},
|
||||
id: "3", title: "Do you provide emergency repair services?", content:
|
||||
"Yes, we handle emergency repairs. Contact us immediately if your vehicle breaks down. We prioritize safety-critical issues like brake and steering problems."},
|
||||
{
|
||||
id: "4",
|
||||
title: "What payment methods do you accept?",
|
||||
content:
|
||||
"We accept cash, credit cards, debit cards, and electronic bank transfers. We also offer financing options for major repairs.",
|
||||
},
|
||||
id: "4", title: "What payment methods do you accept?", content:
|
||||
"We accept cash, credit cards, debit cards, and electronic bank transfers. We also offer financing options for major repairs."},
|
||||
]}
|
||||
useInvertedBackground={true}
|
||||
animationType="slide-up"
|
||||
|
||||
@@ -1,51 +1,39 @@
|
||||
"use client";
|
||||
import { SVGProps } from 'react';
|
||||
|
||||
import { memo } from "react";
|
||||
import useSvgTextLogo from "./useSvgTextLogo";
|
||||
import { cls } from "@/lib/utils";
|
||||
|
||||
interface SvgTextLogoProps {
|
||||
logoText: string;
|
||||
adjustHeightFactor?: number;
|
||||
verticalAlign?: "top" | "center";
|
||||
interface SvgTextLogoProps extends SVGProps<SVGSVGElement> {
|
||||
text?: string;
|
||||
className?: string;
|
||||
}
|
||||
|
||||
const SvgTextLogo = memo<SvgTextLogoProps>(function SvgTextLogo({
|
||||
logoText,
|
||||
adjustHeightFactor,
|
||||
verticalAlign = "top",
|
||||
className = "",
|
||||
}) {
|
||||
const { svgRef, textRef, viewBox, aspectRatio } = useSvgTextLogo(logoText, false, adjustHeightFactor);
|
||||
|
||||
export default function SvgTextLogo({
|
||||
text = 'WEBILD',
|
||||
className = '',
|
||||
...props
|
||||
}: SvgTextLogoProps) {
|
||||
return (
|
||||
<svg
|
||||
ref={svgRef}
|
||||
viewBox={viewBox}
|
||||
className={cls("w-full", className)}
|
||||
style={{ aspectRatio: aspectRatio }}
|
||||
preserveAspectRatio="none"
|
||||
role="img"
|
||||
aria-label={`${logoText} logo`}
|
||||
viewBox="0 0 200 50"
|
||||
className={`w-full h-full ${className}`}
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
{...props}
|
||||
>
|
||||
<defs>
|
||||
<linearGradient id="textGradient" x1="0%" y1="0%" x2="100%" y2="0%">
|
||||
<stop offset="0%" style={{ stopColor: '#ff6b6b', stopOpacity: 1 }} />
|
||||
<stop offset="100%" style={{ stopColor: '#4ecdc4', stopOpacity: 1 }} />
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<text
|
||||
ref={textRef}
|
||||
x="0"
|
||||
y={verticalAlign === "center" ? "50%" : "0"}
|
||||
className="font-bold fill-current"
|
||||
style={{
|
||||
fontSize: "20px",
|
||||
letterSpacing: "-0.02em",
|
||||
dominantBaseline: verticalAlign === "center" ? "middle" : "text-before-edge"
|
||||
}}
|
||||
x="10"
|
||||
y="35"
|
||||
fontSize="32"
|
||||
fontWeight="bold"
|
||||
fill="url(#textGradient)"
|
||||
dominantBaseline="auto"
|
||||
fontFamily="Arial, sans-serif"
|
||||
>
|
||||
{logoText}
|
||||
{text}
|
||||
</text>
|
||||
</svg>
|
||||
);
|
||||
});
|
||||
|
||||
SvgTextLogo.displayName = "SvgTextLogo";
|
||||
|
||||
export default SvgTextLogo;
|
||||
}
|
||||
Reference in New Issue
Block a user