diff --git a/src/app/page.tsx b/src/app/page.tsx index 39eafe2..686ad3a 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -21,7 +21,7 @@ export default function LandingPage() { borderRadius="soft" contentWidth="mediumLarge" sizing="largeSizeMediumTitles" - background="noiseDiagonalGradient" + background="circleGradient" cardStyle="outline" primaryButtonStyle="double-inset" secondaryButtonStyle="solid" @@ -46,12 +46,12 @@ export default function LandingPage() { title="Your Trusted Twin Cities Plumber" description="Fast response. Fair prices. Honest service. Z's Plumbing LLC has been serving the Twin Cities with integrity and expertise for over 15 years." tag="Twin Cities Local Service" - background={{ variant: "noiseDiagonalGradient" }} + background={{ variant: "plain" }} buttons={[ { text: "📞 Call Now", href: "tel:+16125551234" }, { text: "Request Service", href: "#contact" } ]} - imageSrc="http://img.b2bpic.net/free-photo/close-up-mechanic-working_23-2148480380.jpg?_wi=1" + imageSrc="http://img.b2bpic.net/free-photo/close-up-mechanic-working_23-2148480380.jpg" imageAlt="Professional plumber providing trusted Twin Cities service" /> @@ -82,7 +82,7 @@ export default function LandingPage() { id: "1", name: "Emergency Plumbing", price: "Fast Response", imageSrc: "http://img.b2bpic.net/free-photo/front-view-car-service-employees-with-wrench_23-2148327585.jpg", imageAlt: "Emergency plumbing service" }, { - id: "2", name: "Plumbing Repairs", price: "Fair Pricing", imageSrc: "http://img.b2bpic.net/free-photo/close-up-mechanic-working_23-2148480380.jpg?_wi=2", imageAlt: "Professional plumbing repairs" + id: "2", name: "Plumbing Repairs", price: "Fair Pricing", imageSrc: "http://img.b2bpic.net/free-photo/close-up-mechanic-working_23-2148480380.jpg", imageAlt: "Professional plumbing repairs" }, { id: "3", name: "Drain Cleaning", price: "Guaranteed Results", imageSrc: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721542.jpg", imageAlt: "Professional drain cleaning" @@ -110,20 +110,16 @@ export default function LandingPage() { description="What sets us apart in the Twin Cities plumbing market" features={[ { - id: "1", title: "Honest Pricing", author: "Transparent & Fair", description: "No hidden fees, no surprise charges. We quote it right the first time. Our customers appreciate our straightforward approach to pricing.", tags: ["Transparent", "Fair"], - imageSrc: "http://img.b2bpic.net/free-vector/labor-day-badges-collection-flat-style_23-2147864471.jpg?_wi=1", imageAlt: "Honest pricing guarantee" + id: "1", title: "Honest Pricing", author: "Transparent & Fair", description: "No hidden fees, no surprise charges. We quote it right the first time. Our customers appreciate our straightforward approach to pricing.", tags: ["Transparent", "Fair"], imageSrc: "http://img.b2bpic.net/free-vector/labor-day-badges-collection-flat-style_23-2147864471.jpg", imageAlt: "Honest pricing guarantee" }, { - id: "2", title: "Local Service", author: "Twin Cities Experts", description: "We're part of your community, not a corporate chain. We understand Twin Cities homes and their unique plumbing challenges.", tags: ["Local", "Community"], - imageSrc: "http://img.b2bpic.net/free-vector/labor-day-badges-collection-flat-style_23-2147864471.jpg?_wi=2", imageAlt: "Local Twin Cities service" + id: "2", title: "Local Service", author: "Twin Cities Experts", description: "We're part of your community, not a corporate chain. We understand Twin Cities homes and their unique plumbing challenges.", tags: ["Local", "Community"], imageSrc: "http://img.b2bpic.net/free-vector/labor-day-badges-collection-flat-style_23-2147864471.jpg", imageAlt: "Local Twin Cities service" }, { - id: "3", title: "Fast Response Times", author: "Same-Day Service Available", description: "Emergencies don't wait. We prioritize urgent calls and offer same-day service for critical plumbing issues.", tags: ["Fast", "Available"], - imageSrc: "http://img.b2bpic.net/free-vector/labor-day-badges-collection-flat-style_23-2147864471.jpg?_wi=3", imageAlt: "Fast response service" + id: "3", title: "Fast Response Times", author: "Same-Day Service Available", description: "Emergencies don't wait. We prioritize urgent calls and offer same-day service for critical plumbing issues.", tags: ["Fast", "Available"], imageSrc: "http://img.b2bpic.net/free-vector/labor-day-badges-collection-flat-style_23-2147864471.jpg", imageAlt: "Fast response service" }, { - id: "4", title: "Highly Rated", author: "4.8 Stars Average", description: "Our customers speak for us. Over 200 positive reviews from satisfied homeowners across the Twin Cities.", tags: ["Trusted", "Reviews"], - imageSrc: "http://img.b2bpic.net/free-vector/labor-day-badges-collection-flat-style_23-2147864471.jpg?_wi=4", imageAlt: "Highly rated service" + id: "4", title: "Highly Rated", author: "4.8 Stars Average", description: "Our customers speak for us. Over 200 positive reviews from satisfied homeowners across the Twin Cities.", tags: ["Trusted", "Reviews"], imageSrc: "http://img.b2bpic.net/free-vector/labor-day-badges-collection-flat-style_23-2147864471.jpg", imageAlt: "Highly rated service" } ]} animationType="slide-up" diff --git a/src/components/shared/SvgTextLogo/SvgTextLogo.tsx b/src/components/shared/SvgTextLogo/SvgTextLogo.tsx index f214190..2f6da08 100644 --- a/src/components/shared/SvgTextLogo/SvgTextLogo.tsx +++ b/src/components/shared/SvgTextLogo/SvgTextLogo.tsx @@ -1,51 +1,62 @@ -"use client"; +import React, { 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 { + text?: string; + fontSize?: number; + fontFamily?: string; + fontWeight?: number | string; + letterSpacing?: number; className?: string; } -const SvgTextLogo = memo(function SvgTextLogo({ - logoText, - adjustHeightFactor, - verticalAlign = "top", - className = "", -}) { - const { svgRef, textRef, viewBox, aspectRatio } = useSvgTextLogo(logoText, false, adjustHeightFactor); +const SvgTextLogo: React.FC = ({ + text = 'Webild', + fontSize = 24, + fontFamily = 'inherit', + fontWeight = 700, + letterSpacing = 0, + className = '', + ...props +}) => { + const textElement = React.useRef(null); + const [bbox, setBbox] = React.useState({ x: 0, y: 0, width: 100, height: 50 }); + + React.useEffect(() => { + if (textElement.current) { + try { + const bboxData = textElement.current.getBBox(); + setBbox(bboxData); + } catch (e) { + // Fallback if getBBox fails + setBbox({ x: 0, y: 0, width: 100, height: 50 }); + } + } + }, [text, fontSize]); + + const padding = 8; + const viewBoxWidth = bbox.width + padding * 2; + const viewBoxHeight = bbox.height + padding * 2; return ( - {logoText} + {text} ); -}); +}; -SvgTextLogo.displayName = "SvgTextLogo"; - -export default SvgTextLogo; +export default SvgTextLogo; \ No newline at end of file