Merge version_3 into main #4
182
src/app/page.tsx
182
src/app/page.tsx
@@ -12,9 +12,14 @@ import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen
|
||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
||||
import { Award, Clock, ShieldCheck } from "lucide-react";
|
||||
import { Award, Clock, ShieldCheck, Languages } from "lucide-react";
|
||||
import { useState } from 'react';
|
||||
|
||||
export default function LandingPage() {
|
||||
const [lang, setLang] = useState('en');
|
||||
|
||||
const t = (en: string, es: string) => lang === 'es' ? es : en;
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="icon-arrow"
|
||||
@@ -32,18 +37,15 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Services", id: "/services"},
|
||||
{
|
||||
name: "Why Us", id: "/about"},
|
||||
{
|
||||
name: "Reviews", id: "/reviews"},
|
||||
{
|
||||
name: "Contact", id: "/contact"},
|
||||
{ name: t("Services", "Servicios"), id: "/services" },
|
||||
{ name: t("Why Us", "Por qué nosotros"), id: "/about" },
|
||||
{ name: t("Reviews", "Reseñas"), id: "/reviews" },
|
||||
{ name: t("Contact", "Contacto"), id: "/contact" },
|
||||
{ name: "ES/EN", id: "lang-switch" },
|
||||
]}
|
||||
brandName="ArborPro"
|
||||
button={{
|
||||
text: "Get Quote", href: "/contact"}}
|
||||
text: t("Get Quote", "Obtener Presupuesto"), href: "/contact"}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -51,25 +53,18 @@ export default function LandingPage() {
|
||||
<HeroBillboardCarousel
|
||||
background={{
|
||||
variant: "gradient-bars"}}
|
||||
title="Professional Tree Trimming, Safely Done Right"
|
||||
description="Certified arborists protecting your property and landscape. Free estimates, fully insured, same-week service available."
|
||||
title={t("Professional Tree Trimming, Safely Done Right", "Poda Profesional de Árboles, Realizada de Forma Segura")}
|
||||
description={t("Certified arborists protecting your property and landscape. Free estimates, fully insured, same-week service available.", "Arboristas certificados protegiendo su propiedad y paisaje. Presupuestos gratuitos, totalmente asegurados, servicio disponible en la misma semana.")}
|
||||
buttons={[
|
||||
{
|
||||
text: "Request Free Estimate", href: "/contact"},
|
||||
{ text: t("Request Free Estimate", "Solicitar Presupuesto Gratuito"), href: "/contact" },
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CpR37lvekQ9JMF0P8rxVBCmgJD/uploaded-1777080404678-kxh2doap.png?_wi=1", imageAlt: "Trimming service 1"},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CpR37lvekQ9JMF0P8rxVBCmgJD/uploaded-1777080404678-shllb02o.png", imageAlt: "Trimming service 2"},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CpR37lvekQ9JMF0P8rxVBCmgJD/uploaded-1777080404678-au8ffj43.png", imageAlt: "Trimming service 3"},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CpR37lvekQ9JMF0P8rxVBCmgJD/uploaded-1777080404678-ovpoqe87.png", imageAlt: "Trimming service 4"},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CpR37lvekQ9JMF0P8rxVBCmgJD/uploaded-1777080404679-gxcczyl5.png", imageAlt: "Trimming service 5"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-prepares-climb-ropes-park_1304-4997.jpg?_wi=1", imageAlt: "Trimming service 6"},
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CpR37lvekQ9JMF0P8rxVBCmgJD/uploaded-1777080404678-kxh2doap.png?_wi=1", imageAlt: "Trimming service 1" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CpR37lvekQ9JMF0P8rxVBCmgJD/uploaded-1777080404678-shllb02o.png", imageAlt: "Trimming service 2" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CpR37lvekQ9JMF0P8rxVBCmgJD/uploaded-1777080404678-au8ffj43.png", imageAlt: "Trimming service 3" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CpR37lvekQ9JMF0P8rxVBCmgJD/uploaded-1777080404678-ovpoqe87.png", imageAlt: "Trimming service 4" },
|
||||
{ imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CpR37lvekQ9JMF0P8rxVBCmgJD/uploaded-1777080404679-gxcczyl5.png", imageAlt: "Trimming service 5" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/man-prepares-climb-ropes-park_1304-4997.jpg?_wi=1", imageAlt: "Trimming service 6" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -77,17 +72,11 @@ export default function LandingPage() {
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
useInvertedBackground={true}
|
||||
title="Why Property Owners Choose Us"
|
||||
title={t("Why Property Owners Choose Us", "Por qué los dueños de propiedades nos eligen")}
|
||||
metrics={[
|
||||
{
|
||||
icon: ShieldCheck,
|
||||
label: "Fully Insured", value: "100%"},
|
||||
{
|
||||
icon: Award,
|
||||
label: "Certified Arborists", value: "15+"},
|
||||
{
|
||||
icon: Clock,
|
||||
label: "Years Experience", value: "20+"},
|
||||
{ icon: ShieldCheck, label: t("Fully Insured", "Totalmente Asegurado"), value: "100%" },
|
||||
{ icon: Award, label: t("Certified Arborists", "Arboristas Certificados"), value: "15+" },
|
||||
{ icon: Clock, label: t("Years Experience", "Años de Experiencia"), value: "20+" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
@@ -99,36 +88,24 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "1", title: "Tree Pruning", author: "Pro Team", description: "Expert canopy management to enhance health and property aesthetics.", tags: [
|
||||
"Maintenance"],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-prepares-climb-ropes-park_1304-4997.jpg?_wi=2"},
|
||||
{
|
||||
id: "2", title: "Hazardous Removal", author: "Removal Team", description: "Safe, efficient removal of dead or dangerous trees by specialists.", tags: [
|
||||
"Safety"],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pile-logs-green-forest_181624-42990.jpg"},
|
||||
{
|
||||
id: "3", title: "Stump Grinding", author: "Cleanup Team", description: "Complete removal of stumps to reclaim your landscape space.", tags: [
|
||||
"Cleanup"],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/faceless-lumberman-chopping-log-forest_23-2148253379.jpg"},
|
||||
{ id: "1", title: t("Tree Pruning", "Poda de Árboles"), author: "Pro Team", description: t("Expert canopy management to enhance health and property aesthetics.", "Gestión experta de copas para mejorar la salud y estética de la propiedad."), tags: [t("Maintenance", "Mantenimiento")], imageSrc: "http://img.b2bpic.net/free-photo/man-prepares-climb-ropes-park_1304-4997.jpg?_wi=2" },
|
||||
{ id: "2", title: t("Hazardous Removal", "Eliminación de Peligros"), author: "Removal Team", description: t("Safe, efficient removal of dead or dangerous trees by specialists.", "Eliminación segura y eficiente de árboles muertos o peligrosos por especialistas."), tags: [t("Safety", "Seguridad")], imageSrc: "http://img.b2bpic.net/free-photo/pile-logs-green-forest_181624-42990.jpg" },
|
||||
{ id: "3", title: t("Stump Grinding", "Trituración de Tocones"), author: "Cleanup Team", description: t("Complete removal of stumps to reclaim your landscape space.", "Eliminación completa de tocones para recuperar el espacio de su paisaje."), tags: [t("Cleanup", "Limpieza")], imageSrc: "http://img.b2bpic.net/free-photo/faceless-lumberman-chopping-log-forest_23-2148253379.jpg" },
|
||||
]}
|
||||
title="Our Specialized Tree Services"
|
||||
description="Precision care for every tree on your property, ensuring health and safety."
|
||||
title={t("Our Specialized Tree Services", "Nuestros Servicios Especializados")}
|
||||
description={t("Precision care for every tree on your property, ensuring health and safety.", "Cuidado de precisión para cada árbol en su propiedad, garantizando salud y seguridad.")}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardFourteen
|
||||
useInvertedBackground={true}
|
||||
title="Safety & Performance Stats"
|
||||
tag="Trusted Quality"
|
||||
title={t("Safety & Performance Stats", "Estadísticas de Seguridad y Rendimiento")}
|
||||
tag={t("Trusted Quality", "Calidad de Confianza")}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1", value: "5000+", description: "Trees Safely Trimmed"},
|
||||
{
|
||||
id: "m2", value: "98%", description: "Customer Satisfaction"},
|
||||
{
|
||||
id: "m3", value: "24/7", description: "Emergency Availability"},
|
||||
{ id: "m1", value: "5000+", description: t("Trees Safely Trimmed", "Árboles Podados de Forma Segura") },
|
||||
{ id: "m2", value: "98%", description: t("Customer Satisfaction", "Satisfacción del Cliente") },
|
||||
{ id: "m3", value: "24/7", description: t("Emergency Availability", "Disponibilidad de Emergencia") },
|
||||
]}
|
||||
metricsAnimation="blur-reveal"
|
||||
/>
|
||||
@@ -140,43 +117,17 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Sarah Miller", role: "Homeowner", company: "Resident", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-couple-browsing-tablet-table_23-2147895027.jpg"},
|
||||
{
|
||||
id: "2", name: "David Chen", role: "Property Manager", company: "Management", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-attractive-smiling-woman_171337-4171.jpg"},
|
||||
{
|
||||
id: "3", name: "Robert Smith", role: "Homeowner", company: "Resident", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/gardening-mid-aged-man-working-garden-with-gtareden-inventory_259150-58928.jpg"},
|
||||
{
|
||||
id: "4", name: "Maria Garcia", role: "Landowner", company: "Resident", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stylish-young-university-student-girl-sits-park-lawn-leans-tree-smiles-resting-outdoors_1258-137859.jpg"},
|
||||
{
|
||||
id: "5", name: "Tom Baker", role: "Manager", company: "Commercial", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/group-friends-restaurant_23-2148395357.jpg"},
|
||||
{ id: "1", name: "Sarah Miller", role: t("Homeowner", "Propietario"), company: "Resident", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/smiling-couple-browsing-tablet-table_23-2147895027.jpg" },
|
||||
{ id: "2", name: "David Chen", role: t("Property Manager", "Gestor de Propiedades"), company: "Management", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-attractive-smiling-woman_171337-4171.jpg" },
|
||||
{ id: "3", name: "Robert Smith", role: t("Homeowner", "Propietario"), company: "Resident", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/gardening-mid-aged-man-working-garden-with-gtareden-inventory_259150-58928.jpg" },
|
||||
]}
|
||||
kpiItems={[
|
||||
{
|
||||
value: "4.9/5", label: "Avg Rating"},
|
||||
{
|
||||
value: "100%", label: "Reliability"},
|
||||
{
|
||||
value: "500+", label: "Reviews"},
|
||||
{ value: "4.9/5", label: t("Avg Rating", "Calificación Promedio") },
|
||||
{ value: "100%", label: t("Reliability", "Confiabilidad") },
|
||||
{ value: "500+", label: t("Reviews", "Reseñas") },
|
||||
]}
|
||||
title="What Our Clients Say"
|
||||
description="Hear from the homeowners and property managers we've helped."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="socialProof" data-section="socialProof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
names={[
|
||||
"Evergreen Management", "Oakland HOA", "Maple Grove Realty", "Pine Valley Estates", "Cedar Crest Services", "Willow Creek Prop", "Birch Grove Association"]}
|
||||
title="We Work With The Best"
|
||||
description="Trusted by leading property management firms and local associations."
|
||||
title={t("What Our Clients Say", "Lo que Dicen Nuestros Clientes")}
|
||||
description={t("Hear from the homeowners and property managers we've helped.", "Escuche a los propietarios y gestores de propiedades a los que hemos ayudado.")}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -184,14 +135,10 @@ export default function LandingPage() {
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1", title: "Are you fully insured?", content: "Yes, we are fully licensed and insured for your protection and property safety."},
|
||||
{
|
||||
id: "q2", title: "Do you offer emergency service?", content: "We offer 24/7 emergency response for storm damage and dangerous tree hazards."},
|
||||
{
|
||||
id: "q3", title: "How long until you can start?", content: "We pride ourselves on responsive service and can often schedule same-week assessments."},
|
||||
{ id: "q1", title: t("Are you fully insured?", "¿Están totalmente asegurados?"), content: t("Yes, we are fully licensed and insured for your protection and property safety.", "Sí, estamos totalmente licenciados y asegurados para su protección y seguridad de la propiedad.") },
|
||||
{ id: "q2", title: t("Do you offer emergency service?", "¿Ofrecen servicio de emergencia?"), content: t("We offer 24/7 emergency response for storm damage and dangerous tree hazards.", "Ofrecemos respuesta de emergencia 24/7 para daños por tormenta y peligros de árboles peligrosos.") },
|
||||
]}
|
||||
sideTitle="Frequently Asked Questions"
|
||||
sideTitle={t("Frequently Asked Questions", "Preguntas Frecuentes")}
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
@@ -199,14 +146,12 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "plain"}}
|
||||
tag="Ready to get started?"
|
||||
title="Schedule Your Free Estimate"
|
||||
description="Fill out our form or call us to discuss your tree care needs today."
|
||||
background={{ variant: "plain" }}
|
||||
tag={t("Ready to get started?", "¿Listo para comenzar?")}
|
||||
title={t("Schedule Your Free Estimate", "Programe su Presupuesto Gratuito")}
|
||||
description={t("Fill out our form or call us to discuss your tree care needs today.", "Complete nuestro formulario o llámenos para discutir sus necesidades de cuidado de árboles hoy mismo.")}
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Us Now", href: "/contact"},
|
||||
{ text: t("Contact Us Now", "Contáctenos Ahora"), href: "/contact" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -216,30 +161,7 @@ export default function LandingPage() {
|
||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3CpR37lvekQ9JMF0P8rxVBCmgJD/uploaded-1777080404678-kxh2doap.png?_wi=2"
|
||||
logoText="ArborPro"
|
||||
columns={[
|
||||
{
|
||||
title: "Company", items: [
|
||||
{
|
||||
label: "About Us", href: "/about"},
|
||||
{
|
||||
label: "Reviews", href: "/reviews"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Services", items: [
|
||||
{
|
||||
label: "Pruning", href: "/services"},
|
||||
{
|
||||
label: "Removal", href: "/services"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support", items: [
|
||||
{
|
||||
label: "Contact", href: "/contact"},
|
||||
{
|
||||
label: "Privacy", href: "/privacy"},
|
||||
],
|
||||
},
|
||||
{ title: t("Company", "Empresa"), items: [{ label: t("About Us", "Sobre Nosotros"), href: "/about" }, { label: t("Reviews", "Reseñas"), href: "/reviews" }] },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -10,15 +10,15 @@
|
||||
--accent: #ffffff;
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #f5f4f0;
|
||||
--card: #ffffff;
|
||||
--foreground: #1a1a1a;
|
||||
--primary-cta: #0a7039;
|
||||
--background: #0a0a0a;
|
||||
--card: #1a1a1a;
|
||||
--foreground: #ffffffe6;
|
||||
--primary-cta: #e6e6e6;
|
||||
--primary-cta-text: #ffffff;
|
||||
--secondary-cta: #ffffff;
|
||||
--secondary-cta: #1a1a1a;
|
||||
--secondary-cta-text: #0a7039;
|
||||
--accent: #8a8a8a;
|
||||
--background-accent: #e8e6e1;
|
||||
--accent: #737373;
|
||||
--background-accent: #737373;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user