Merge version_1 into main #2

Merged
bender merged 2 commits from version_1 into main 2026-03-13 00:45:49 +00:00
2 changed files with 46 additions and 55 deletions

View File

@@ -20,7 +20,7 @@ export default function LandingPage() {
borderRadius="rounded"
contentWidth="compact"
sizing="largeSmall"
background="blurBottom"
background="circleGradient"
cardStyle="gradient-bordered"
primaryButtonStyle="flat"
secondaryButtonStyle="layered"
@@ -45,7 +45,7 @@ export default function LandingPage() {
<HeroBillboardRotatedCarousel
title="Premium Mobile Car Detailing"
description="Transform your vehicle with professional detailing services. From exterior shine to interior perfection, we bring showroom quality to your doorstep."
background={{ variant: "blurBottom" }}
background={{ variant: "plain" }}
tag="Professional Service"
tagIcon={Sparkles}
tagAnimation="slide-up"
@@ -55,12 +55,12 @@ export default function LandingPage() {
]}
buttonAnimation="slide-up"
carouselItems={[
{ id: "1", imageSrc: "http://img.b2bpic.net/free-photo/young-man-looking-car-rent_1303-16344.jpg?_wi=1", imageAlt: "car detailing service professional washing" },
{ id: "2", imageSrc: "http://img.b2bpic.net/free-photo/close-up-car-care-process_23-2149193570.jpg?_wi=1", imageAlt: "car exterior detailing wash shine" },
{ id: "3", imageSrc: "http://img.b2bpic.net/free-photo/automobile-details-close-up-new-car_1303-26495.jpg?_wi=1", imageAlt: "car interior cleaning vacuum" },
{ id: "4", imageSrc: "http://img.b2bpic.net/free-photo/car-wash-detailing-station_1303-22304.jpg?_wi=1", imageAlt: "ceramic coating application car" },
{ id: "5", imageSrc: "http://img.b2bpic.net/free-photo/young-man-looking-car-rent_1303-16344.jpg?_wi=2", imageAlt: "car detailing service professional washing" },
{ id: "6", imageSrc: "http://img.b2bpic.net/free-photo/close-up-car-care-process_23-2149193570.jpg?_wi=2", imageAlt: "car exterior detailing wash shine" }
{ id: "1", imageSrc: "http://img.b2bpic.net/free-photo/young-man-looking-car-rent_1303-16344.jpg", imageAlt: "car detailing service professional washing" },
{ id: "2", imageSrc: "http://img.b2bpic.net/free-photo/close-up-car-care-process_23-2149193570.jpg", imageAlt: "car exterior detailing wash shine" },
{ id: "3", imageSrc: "http://img.b2bpic.net/free-photo/automobile-details-close-up-new-car_1303-26495.jpg", imageAlt: "car interior cleaning vacuum" },
{ id: "4", imageSrc: "http://img.b2bpic.net/free-photo/car-wash-detailing-station_1303-22304.jpg", imageAlt: "ceramic coating application car" },
{ id: "5", imageSrc: "http://img.b2bpic.net/free-photo/young-man-looking-car-rent_1303-16344.jpg", imageAlt: "car detailing service professional washing" },
{ id: "6", imageSrc: "http://img.b2bpic.net/free-photo/close-up-car-care-process_23-2149193570.jpg", imageAlt: "car exterior detailing wash shine" }
]}
autoPlay={true}
autoPlayInterval={4000}
@@ -74,18 +74,18 @@ export default function LandingPage() {
features={[
{
id: 1,
title: "Exterior Detailing", description: "Complete exterior restoration including paint correction, polishing, and protective sealant application for a mirror-like finish that turns heads.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-car-care-process_23-2149193570.jpg?_wi=3", imageAlt: "car exterior detailing wash shine" },
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/young-man-looking-car-rent_1303-16344.jpg?_wi=3", imageAlt: "car detailing service professional washing" }
title: "Exterior Detailing", description: "Complete exterior restoration including paint correction, polishing, and protective sealant application for a mirror-like finish that turns heads.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-car-care-process_23-2149193570.jpg", imageAlt: "car exterior detailing wash shine" },
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/young-man-looking-car-rent_1303-16344.jpg", imageAlt: "car detailing service professional washing" }
},
{
id: 2,
title: "Interior Detailing", description: "Deep cleaning of your vehicle's interior with professional vacuuming, upholstery conditioning, and premium leather treatments.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/automobile-details-close-up-new-car_1303-26495.jpg?_wi=2", imageAlt: "car interior cleaning vacuum" },
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/young-man-looking-car-rent_1303-16344.jpg?_wi=4", imageAlt: "car detailing service professional washing" }
title: "Interior Detailing", description: "Deep cleaning of your vehicle's interior with professional vacuuming, upholstery conditioning, and premium leather treatments.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/automobile-details-close-up-new-car_1303-26495.jpg", imageAlt: "car interior cleaning vacuum" },
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/young-man-looking-car-rent_1303-16344.jpg", imageAlt: "car detailing service professional washing" }
},
{
id: 3,
title: "Ceramic Coating", description: "Advanced nano-ceramic protection that provides long-lasting defense against environmental contaminants, UV rays, and oxidation.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/car-wash-detailing-station_1303-22304.jpg?_wi=2", imageAlt: "ceramic coating application car" },
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-car-care-process_23-2149193570.jpg?_wi=4", imageAlt: "car exterior detailing wash shine" }
title: "Ceramic Coating", description: "Advanced nano-ceramic protection that provides long-lasting defense against environmental contaminants, UV rays, and oxidation.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/car-wash-detailing-station_1303-22304.jpg", imageAlt: "ceramic coating application car" },
phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-car-care-process_23-2149193570.jpg", imageAlt: "car exterior detailing wash shine" }
}
]}
showStepNumbers={true}
@@ -119,15 +119,15 @@ export default function LandingPage() {
products={[
{
id: "1", brand: "Davis Detail", name: "Standard Exterior Detail", price: "$150", rating: 5,
reviewCount: "450+", imageSrc: "http://img.b2bpic.net/free-photo/close-up-car-care-process_23-2149193570.jpg?_wi=5", imageAlt: "car exterior detailing wash shine"
reviewCount: "450+", imageSrc: "http://img.b2bpic.net/free-photo/close-up-car-care-process_23-2149193570.jpg", imageAlt: "car exterior detailing wash shine"
},
{
id: "2", brand: "Davis Detail", name: "Complete Package", price: "$350", rating: 5,
reviewCount: "680+", imageSrc: "http://img.b2bpic.net/free-photo/young-man-looking-car-rent_1303-16344.jpg?_wi=5", imageAlt: "car detailing service professional washing"
reviewCount: "680+", imageSrc: "http://img.b2bpic.net/free-photo/young-man-looking-car-rent_1303-16344.jpg", imageAlt: "car detailing service professional washing"
},
{
id: "3", brand: "Davis Detail", name: "Ceramic Elite", price: "$550", rating: 5,
reviewCount: "520+", imageSrc: "http://img.b2bpic.net/free-photo/car-wash-detailing-station_1303-22304.jpg?_wi=3", imageAlt: "ceramic coating application car"
reviewCount: "520+", imageSrc: "http://img.b2bpic.net/free-photo/car-wash-detailing-station_1303-22304.jpg", imageAlt: "ceramic coating application car"
}
]}
gridVariant="three-columns-all-equal-width"
@@ -147,7 +147,7 @@ export default function LandingPage() {
{ id: "3", value: "100%", description: "Quality Guarantee" },
{ id: "4", value: "7 Days", description: "Service Availability" }
]}
gridVariant="four-items-2x2-equal-grid"
gridVariant="uniform-all-items-equal"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
@@ -178,7 +178,7 @@ export default function LandingPage() {
tagAnimation="slide-up"
title="Ready for a Transformation?"
description="Schedule your premium detailing service today. Contact us for availability and to discuss your vehicle's specific needs."
background={{ variant: "blurBottom" }}
background={{ variant: "plain" }}
useInvertedBackground={false}
inputPlaceholder="Enter your email"
buttonText="Book Service"

View File

@@ -1,51 +1,42 @@
"use client";
import { memo } from "react";
import useSvgTextLogo from "./useSvgTextLogo";
import { cls } from "@/lib/utils";
import React from 'react';
interface SvgTextLogoProps {
logoText: string;
adjustHeightFactor?: number;
verticalAlign?: "top" | "center";
text: string;
fontSize?: number;
fontFamily?: string;
fillColor?: string;
className?: string;
}
const SvgTextLogo = memo<SvgTextLogoProps>(function SvgTextLogo({
logoText,
adjustHeightFactor,
verticalAlign = "top",
className = "",
}) {
const { svgRef, textRef, viewBox, aspectRatio } = useSvgTextLogo(logoText, false, adjustHeightFactor);
const SvgTextLogo: React.FC<SvgTextLogoProps> = ({
text,
fontSize = 48,
fontFamily = 'Arial, sans-serif',
fillColor = '#000000',
className = '',
}) => {
return (
<svg
ref={svgRef}
viewBox={viewBox}
className={cls("w-full", className)}
style={{ aspectRatio: aspectRatio }}
preserveAspectRatio="none"
width="200"
height="100"
viewBox="0 0 200 100"
className={className}
role="img"
aria-label={`${logoText} logo`}
aria-label={text}
>
<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="50%"
y="50%"
fontSize={fontSize}
fontFamily={fontFamily}
fill={fillColor}
textAnchor="middle"
dominantBaseline="central"
>
{logoText}
{text}
</text>
</svg>
);
});
};
SvgTextLogo.displayName = "SvgTextLogo";
export default SvgTextLogo;
export default SvgTextLogo;