Files
b8ff2dfd-b0c2-42ce-b9cf-853…/src/app/page.tsx
2026-03-02 19:43:11 +00:00

180 lines
8.5 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import HeroSplit from "@/components/sections/hero/HeroSplit";
import TestimonialCardFifteen from "@/components/sections/testimonial/TestimonialCardFifteen";
import FeatureCardThree from "@/components/sections/feature/featureCardThree/FeatureCardThree";
import TextAbout from "@/components/sections/about/TextAbout";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import ContactText from "@/components/sections/contact/ContactText";
import FooterCard from "@/components/sections/footer/FooterCard";
import { CheckCircle, Mail, MapPin, MessageCircle, Phone, Sparkles, Users } from "lucide-react";
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="text-shift"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="mediumLarge"
sizing="mediumLarge"
background="noise"
cardStyle="glass-depth"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="radial-glow"
headingFontWeight="extrabold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="TuNegocio"
navItems={[
{ name: "Inicio", id: "hero" },
{ name: "Servicios", id: "services" },
{ name: "Comunidad", id: "community" },
{ name: "Contacto", id: "contact-cta" },
]}
button={{ text: "📞 Llamar Ahora", href: "tel:+1234567890" }}
animateOnLoad={true}
className="shadow-lg"
/>
</div>
<div id="hero" data-section="hero">
<HeroSplit
title="Tu Negocio Local de Confianza"
description="Estamos cerca de ti. Atención personalizada, calidad garantizada, y respuesta rápida. Contáctanos ahora y vive la diferencia."
background={{ variant: "plain" }}
tag="Bienvenido"
tagIcon={MapPin}
tagAnimation="slide-up"
buttons={[
{ text: "📞 Llamar Ahora", href: "tel:+1234567890" },
{ text: "💬 WhatsApp", href: "https://wa.me/1234567890" },
]}
buttonAnimation="slide-up"
imageSrc="http://img.b2bpic.net/free-photo/young-happy-waiter-standing-cafe-s-front-door-waving-someone_637285-6578.jpg"
imageAlt="Negocio local profesional"
imagePosition="right"
mediaAnimation="slide-up"
fixedMediaHeight={true}
className="py-20"
/>
</div>
<div id="trust" data-section="trust">
<TestimonialCardFifteen
testimonial="Increíble atención y calidad. No solo me atendieron con profesionalismo, sino como si fuera familia. Definitivamente volveré y los recomendaré."
rating={5}
author="María García, Empresaria Local"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/smiling-businessman-standing-airport_107420-85035.jpg", alt: "María García"},
{
src: "http://img.b2bpic.net/free-photo/smiling-beautiful-middle-aged-business-woman_1262-3085.jpg", alt: "Cliente satisfecho"},
{
src: "http://img.b2bpic.net/free-photo/smiling-young-businessman-suit-looking-camera-meeting_1163-4654.jpg", alt: "Cliente recomendado"},
{
src: "http://img.b2bpic.net/free-photo/portrait-smiling-businessman-sitting-sofa-waiting-area_107420-95816.jpg", alt: "Cliente leal"},
]}
ratingAnimation="slide-up"
avatarsAnimation="slide-up"
useInvertedBackground={true}
className="py-16"
/>
</div>
<div id="services" data-section="services">
<FeatureCardThree
title="Nuestros Servicios"
description="Ofrecemos soluciones integrales con atención directa y resultados garantizados"
tag="Servicios Principales"
tagIcon={Sparkles}
tagAnimation="slide-up"
features={[
{
id: "01", title: "Atención Personalizada", description: "Cada cliente es único. Nos enfocamos en entender tus necesidades específicas y brindarte soluciones a medida.", imageSrc: "http://img.b2bpic.net/free-photo/call-center-onboarding-specialist-tutoring-intern-how-use-csm-system_482257-117972.jpg", imageAlt: "Atención al cliente"},
{
id: "02", title: "Calidad Garantizada", description: "Años de experiencia local nos respaldan. Cada proyecto recibe nuestro máximo compromiso y excelencia.", imageSrc: "http://img.b2bpic.net/free-photo/two-happy-business-people-shaking-hands-meeting-while-other-colleagues-are-applauding-them-office_637285-265.jpg", imageAlt: "Trabajo de calidad"},
{
id: "03", title: "Respuesta Rápida", description: "Tu tiempo es valioso. Nos caracterizamos por ser ágiles, eficientes y siempre disponibles para ti.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-businessman-showing-thumb-up-sign-while-team-discussing-background_23-2147923383.jpg", imageAlt: "Servicio rápido"},
]}
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
buttons={[{ text: "Conocer Más", href: "tel:+1234567890" }]}
buttonAnimation="slide-up"
className="py-20"
/>
</div>
<div id="why-us" data-section="why-us">
<TextAbout
tag="Por Qué Elegirnos"
tagIcon={CheckCircle}
tagAnimation="slide-up"
title="✔ Atención Personalizada | ✔ Calidad Garantizada | ✔ Experiencia Local | ✔ Respuesta Rápida | ✔ Precios Claros"
useInvertedBackground={true}
buttons={[
{ text: "📞 Contáctanos Hoy", href: "tel:+1234567890" },
{ text: "Ver Ubicación", href: "#footer" },
]}
buttonAnimation="slide-up"
className="py-16"
/>
</div>
<div id="community" data-section="community">
<SocialProofOne
title="Únete a Nuestra Comunidad Local"
description="Somos más que un negocio: somos parte de tu barrio. Promociones especiales, eventos locales y beneficios exclusivos para nuestra comunidad."
tag="Comunidad"
tagIcon={Users}
tagAnimation="slide-up"
names={[
"Promociones Locales", "Eventos Comunitarios", "Beneficios Exclusivos", "Red de Referidos", "Newsletter Mensual", "Descuentos VIP", "Acceso Prioritario"]}
textboxLayout="default"
useInvertedBackground={false}
buttons={[
{
text: "Unirse a la Comunidad", href: "https://wa.me/1234567890?text=Quiero%20unirme%20a%20la%20comunidad"},
]}
buttonAnimation="slide-up"
speed={35}
showCard={true}
className="py-20"
/>
</div>
<div id="contact-cta" data-section="contact-cta">
<ContactText
text="¿Listo para vivir la experiencia? Contáctanos ahora y descubre por qué somos el negocio local de confianza en tu zona."
animationType="entrance-slide"
background={{ variant: "radial-gradient" }}
useInvertedBackground={true}
buttons={[
{ text: "📞 Llamar Ahora", href: "tel:+1234567890" },
{ text: "💬 Enviar WhatsApp", href: "https://wa.me/1234567890" },
]}
className="py-20"
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="TuNegocio Local"
copyrightText="© 2025 | Tu Negocio Local de Confianza. Todos los derechos reservados."
socialLinks={[
{ icon: Phone, href: "tel:+1234567890", ariaLabel: "Llamar" },
{ icon: MessageCircle, href: "https://wa.me/1234567890", ariaLabel: "WhatsApp" },
{ icon: MapPin, href: "#", ariaLabel: "Ubicación" },
{ icon: Mail, href: "mailto:contacto@tunegocio.local", ariaLabel: "Email" },
]}
className="bg-background"
/>
</div>
</ThemeProvider>
);
}