Merge version_1 into main #2

Merged
bender merged 3 commits from version_1 into main 2026-03-13 03:20:57 +00:00
3 changed files with 80 additions and 174 deletions

View File

@@ -15,7 +15,7 @@ export default function ContactPage() {
borderRadius="rounded"
contentWidth="medium"
sizing="medium"
background="grid"
background="circleGradient"
cardStyle="layered-gradient"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="solid"
@@ -44,15 +44,13 @@ export default function ContactPage() {
description="Ready to schedule tree removal, pruning, or maintenance? Contact Trees A Crowd today. Our team in Perth is ready to help with fast, reliable service and competitive pricing."
buttons={[
{
text: "Call: 0450 552 659",
href: "tel:0450552659"
text: "Call: 0450 552 659", href: "tel:0450552659"
},
{
text: "Send Inquiry",
href: "mailto:info@treesacrowd.com.au"
text: "Send Inquiry", href: "mailto:info@treesacrowd.com.au"
}
]}
background={{ variant: "grid" }}
background={{ variant: "plain" }}
useInvertedBackground={false}
tagAnimation="slide-up"
buttonAnimation="slide-up"
@@ -65,8 +63,7 @@ export default function ContactPage() {
<FooterSimple
columns={[
{
title: "Navigation",
items: [
title: "Navigation", items: [
{ label: "Home", href: "/" },
{ label: "Services", href: "/services" },
{ label: "About", href: "/about" },
@@ -74,8 +71,7 @@ export default function ContactPage() {
]
},
{
title: "Services",
items: [
title: "Services", items: [
{ label: "Tree Removal", href: "/services" },
{ label: "Tree Pruning", href: "/services" },
{ label: "Tree Lopping", href: "/services" },
@@ -83,16 +79,14 @@ export default function ContactPage() {
]
},
{
title: "Contact",
items: [
title: "Contact", items: [
{ label: "Call: 0450 552 659", href: "tel:0450552659" },
{ label: "Craigie, Perth WA", href: "#" },
{ label: "Request Quote", href: "/contact" }
]
},
{
title: "Legal",
items: [
title: "Legal", items: [
{ label: "Privacy Policy", href: "#" },
{ label: "Terms & Conditions", href: "#" }
]

View File

@@ -28,7 +28,7 @@ export default function HomePage() {
borderRadius="rounded"
contentWidth="medium"
sizing="medium"
background="grid"
background="circleGradient"
cardStyle="layered-gradient"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="solid"
@@ -42,13 +42,13 @@ export default function HomePage() {
<HeroLogoBillboardSplit
logoText="TREES A CROWD"
description="Safe, reliable tree removal, pruning, and maintenance by a local team that cares about your property."
background={{ variant: "grid" }}
background={{ variant: "plain" }}
buttons={[
{ text: "Call Now: 0450 552 659", href: "tel:0450552659" },
{ text: "Get a Free Quote", href: "/contact" },
]}
layoutOrder="default"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=o0rg3h&_wi=1"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=o0rg3h"
imageAlt="Professional tree removal service in Perth"
frameStyle="card"
mediaAnimation="slide-up"
@@ -61,93 +61,57 @@ export default function HomePage() {
<FeatureCardTwentyFive
features={[
{
title: "Tree Removal",
description: "Safe and efficient removal of dangerous or unwanted trees. Complete debris cleanup included.",
icon: Trees,
title: "Tree Removal", description: "Safe and efficient removal of dangerous or unwanted trees. Complete debris cleanup included.", icon: Trees,
mediaItems: [
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=o0rg3h&_wi=2",
imageAlt: "Professional tree removal service",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=o0rg3h", imageAlt: "Professional tree removal service"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=5xsd6w&_wi=1",
imageAlt: "Clean site after removal",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=5xsd6w", imageAlt: "Clean site after removal"},
],
},
{
title: "Tree Pruning",
description: "Improve tree health and shape with expert pruning. Enhances growth and maintains structure.",
icon: Scissors,
title: "Tree Pruning", description: "Improve tree health and shape with expert pruning. Enhances growth and maintains structure.", icon: Scissors,
mediaItems: [
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=0olw48&_wi=1",
imageAlt: "Professional pruning service",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=0olw48", imageAlt: "Professional pruning service"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=14j6m1&_wi=1",
imageAlt: "Healthy tree after pruning",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=14j6m1", imageAlt: "Healthy tree after pruning"},
],
},
{
title: "Tree Lopping",
description: "Manage large or overgrown branches safely. Keeps trees healthy and your property clear.",
icon: Zap,
title: "Tree Lopping", description: "Manage large or overgrown branches safely. Keeps trees healthy and your property clear.", icon: Zap,
mediaItems: [
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=y9b7u8&_wi=1",
imageAlt: "Tree lopping service",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=y9b7u8", imageAlt: "Tree lopping service"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=5xsd6w&_wi=2",
imageAlt: "Cleared property space",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=5xsd6w", imageAlt: "Cleared property space"},
],
},
{
title: "Dead Tree Removal",
description: "Safely remove hazardous dead trees. Protects your property from falling branches.",
icon: AlertTriangle,
title: "Dead Tree Removal", description: "Safely remove hazardous dead trees. Protects your property from falling branches.", icon: AlertTriangle,
mediaItems: [
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=w95mpj&_wi=1",
imageAlt: "Dead tree removal service",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=w95mpj", imageAlt: "Dead tree removal service"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=4ixgar&_wi=1",
imageAlt: "Site after removal",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=4ixgar", imageAlt: "Site after removal"},
],
},
{
title: "Tree Maintenance",
description: "Ongoing care to keep your trees healthy year-round. Regular inspections and pruning.",
icon: Heart,
title: "Tree Maintenance", description: "Ongoing care to keep your trees healthy year-round. Regular inspections and pruning.", icon: Heart,
mediaItems: [
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=p2ur98&_wi=1",
imageAlt: "Tree maintenance service",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=p2ur98", imageAlt: "Tree maintenance service"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=14j6m1&_wi=2",
imageAlt: "Well-maintained trees",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=14j6m1", imageAlt: "Well-maintained trees"},
],
},
{
title: "Property Cleanup",
description: "Complete site cleanup after any tree work. Debris removal and site restoration.",
icon: Sparkles,
title: "Property Cleanup", description: "Complete site cleanup after any tree work. Debris removal and site restoration.", icon: Sparkles,
mediaItems: [
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=5xsd6w&_wi=3",
imageAlt: "Clean property",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=5xsd6w", imageAlt: "Clean property"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=4ixgar&_wi=2",
imageAlt: "Site restoration",
},
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=4ixgar", imageAlt: "Site restoration"},
],
},
]}
@@ -182,45 +146,17 @@ export default function HomePage() {
<ProductCardTwo
products={[
{
id: "1",
brand: "Backyard",
name: "Large Tree Removal",
price: "Complete",
rating: 5,
reviewCount: "2024",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=xbvgmv&_wi=1",
imageAlt: "Tree removal before",
},
id: "1", brand: "Backyard", name: "Large Tree Removal", price: "Complete", rating: 5,
reviewCount: "2024", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=xbvgmv", imageAlt: "Tree removal before"},
{
id: "2",
brand: "Cleanup",
name: "Site Restoration",
price: "Complete",
rating: 5,
reviewCount: "2024",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=5xsd6w&_wi=4",
imageAlt: "Site after removal",
},
id: "2", brand: "Cleanup", name: "Site Restoration", price: "Complete", rating: 5,
reviewCount: "2024", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=5xsd6w", imageAlt: "Site after removal"},
{
id: "3",
brand: "Maintenance",
name: "Tree Pruning",
price: "Complete",
rating: 5,
reviewCount: "2024",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9rvv9g&_wi=1",
imageAlt: "Tree before pruning",
},
id: "3", brand: "Maintenance", name: "Tree Pruning", price: "Complete", rating: 5,
reviewCount: "2024", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9rvv9g", imageAlt: "Tree before pruning"},
{
id: "4",
brand: "Healthy Growth",
name: "After Pruning",
price: "Complete",
rating: 5,
reviewCount: "2024",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=14j6m1&_wi=3",
imageAlt: "Tree after pruning",
},
id: "4", brand: "Healthy Growth", name: "After Pruning", price: "Complete", rating: 5,
reviewCount: "2024", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=14j6m1", imageAlt: "Tree after pruning"},
]}
title="Recent Work"
description="Browse our latest tree removal and pruning projects across Perth. Expert work, satisfied customers."
@@ -240,32 +176,14 @@ export default function HomePage() {
<TestimonialCardSixteen
testimonials={[
{
id: "1",
name: "Jonathan Allison",
role: "Homeowner",
company: "Perth, WA",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=azy8ga&_wi=1",
imageAlt: "Jonathan Allison",
},
id: "1", name: "Jonathan Allison", role: "Homeowner", company: "Perth, WA", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=azy8ga", imageAlt: "Jonathan Allison"},
{
id: "2",
name: "Robin",
role: "Business Owner",
company: "A Touch of Glass Massage",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=bjncm1&_wi=1",
imageAlt: "Robin",
},
id: "2", name: "Robin", role: "Business Owner", company: "A Touch of Glass Massage", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=bjncm1", imageAlt: "Robin"},
{
id: "3",
name: "Margaret Chen",
role: "Homeowner",
company: "Craigie, WA",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=azy8ga&_wi=2",
imageAlt: "Margaret Chen",
},
id: "3", name: "Margaret Chen", role: "Homeowner", company: "Craigie, WA", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=azy8ga", imageAlt: "Margaret Chen"},
]}
kpiItems={[
{ value: "500+", label: "Projects Completed" },
@@ -305,8 +223,7 @@ export default function HomePage() {
<FooterSimple
columns={[
{
title: "Navigation",
items: [
title: "Navigation", items: [
{ label: "Home", href: "/" },
{ label: "Services", href: "/services" },
{ label: "About", href: "/about" },
@@ -314,8 +231,7 @@ export default function HomePage() {
],
},
{
title: "Services",
items: [
title: "Services", items: [
{ label: "Tree Removal", href: "/services" },
{ label: "Tree Pruning", href: "/services" },
{ label: "Tree Lopping", href: "/services" },
@@ -323,16 +239,14 @@ export default function HomePage() {
],
},
{
title: "Contact",
items: [
title: "Contact", items: [
{ label: "Call: 0450 552 659", href: "tel:0450552659" },
{ label: "Craigie, Perth WA", href: "#" },
{ label: "Request Quote", href: "/contact" },
],
},
{
title: "Legal",
items: [
title: "Legal", items: [
{ label: "Privacy Policy", href: "#" },
{ label: "Terms & Conditions", href: "#" },
],

View File

@@ -1,51 +1,49 @@
"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;
className?: string;
fontSize?: number;
fontWeight?: number | string;
letterSpacing?: number;
fill?: 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,
className = "", fontSize = 48,
fontWeight = 700,
letterSpacing = 0,
fill = "currentColor"}) => {
const textLength = text.length;
const charWidth = fontSize * 0.6;
const width = textLength * charWidth + letterSpacing * (textLength - 1);
const height = fontSize * 1.2;
const padding = 10;
const viewBoxWidth = width + padding * 2;
const viewBoxHeight = height + padding * 2;
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 ${viewBoxWidth} ${viewBoxHeight}`}
xmlns="http://www.w3.org/2000/svg"
className={className}
preserveAspectRatio="xMidYMid meet"
>
<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={padding}
y={padding + fontSize}
fontSize={fontSize}
fontWeight={fontWeight}
fill={fill}
letterSpacing={letterSpacing}
dominantBaseline="hanging"
fontFamily="system-ui, -apple-system, sans-serif"
>
{logoText}
{text}
</text>
</svg>
);
});
SvgTextLogo.displayName = "SvgTextLogo";
};
export default SvgTextLogo;