Files
11018655-54d8-47dc-8d58-809…/src/app/signup/page.tsx
2026-03-19 15:55:28 +00:00

386 lines
16 KiB
TypeScript

"use client";
import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import HeroSplitTestimonial from "@/components/sections/hero/HeroSplitTestimonial";
import FeatureCardSeven from "@/components/sections/feature/FeatureCardSeven";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import MetricCardTen from "@/components/sections/metrics/MetricCardTen";
import FaqDouble from "@/components/sections/faq/FaqDouble";
import ContactCenter from "@/components/sections/contact/ContactCenter";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
import { Sparkles, Zap, CheckCircle, Award, Shield, TrendingUp, HelpCircle, Mail } from "lucide-react";
export default function SignupPage() {
const navItems = [
{ name: "Cómo Funciona", id: "how-it-works" },
{ name: "Para Empresas", id: "for-businesses" },
{ name: "Para Trabajadores", id: "for-workers" },
{ name: "FAQ", id: "faq" },
];
const handleContactSubmit = (email: string) => {
console.log("Contact form submitted with email:", email);
};
return (
<ThemeProvider
defaultButtonVariant="bounce-effect"
defaultTextAnimation="reveal-blur"
borderRadius="soft"
contentWidth="medium"
sizing="largeSmallSizeLargeTitles"
background="aurora"
cardStyle="outline"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="layered"
headingFontWeight="light"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="Gextras"
navItems={navItems}
button={{
text: "Inicia Sesión",
href: "/login",
}}
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitTestimonial
title="Conecta Tu Talento Hospitalario en Segundos"
description="Gextras es la plataforma inteligente que une empresas de eventos, restaurantes y hoteles con personal calificado de forma inmediata, organizada y confiable."
tag="Revolución Hospitalaria"
tagIcon={Sparkles}
tagAnimation="slide-up"
buttons={[
{
text: "Para Empresas",
href: "/signup?type=business",
},
{
text: "Para Trabajadores",
href: "/signup?type=worker",
},
]}
buttonAnimation="slide-up"
imageSrc="http://img.b2bpic.net/free-vector/general-business-invoice-template_23-2148959395.jpg?_wi=2"
imageAlt="Dashboard de gestión de personal Gextras"
mediaAnimation="blur-reveal"
testimonials={[
{
name: "Carlos Méndez",
handle: "@cmendez_eventos",
testimonial: "Con Gextras cubrimos nuestro evento de 200 personas en menos de 2 horas. Increíble.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-nerdy-waitress-work_329181-2082.jpg?_wi=2",
},
{
name: "María López",
handle: "@mlopez_hostelera",
testimonial: "Ganamos más flexibilidad y confianza. El sistema es tan rápido que no lo creemos.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/african-american-woman-overalls-beret-against-wooden-wall_627829-6901.jpg?_wi=2",
},
{
name: "Roberto García",
handle: "@rgarcia_hotel",
testimonial: "Hemos reducido tiempos de contratación al 80%. Gextras es imprescindible.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/3-young-workers-office_1301-5371.jpg?_wi=2",
},
{
name: "Sofía Ruiz",
handle: "@sruiz_staff",
testimonial: "Finalmente trabajo cuando quiero. Gextras me dio libertad y oportunidades.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-doing-pottery_23-2148944912.jpg?_wi=2",
},
]}
testimonialRotationInterval={5000}
useInvertedBackground={false}
background={{
variant: "radial-gradient",
}}
/>
</div>
<div id="how-it-works" data-section="how-it-works">
<FeatureCardSeven
title="Cómo Funciona Gextras"
description="Un flujo de trabajo simple, transparente y diseñado para ahorrar tiempo a empresas y crear oportunidades para trabajadores."
tag="Proceso Inteligente"
tagIcon={Zap}
tagAnimation="slide-up"
buttons={[
{
text: "Explora Más",
href: "#benefits",
},
]}
buttonAnimation="slide-up"
textboxLayout="split"
animationType="slide-up"
useInvertedBackground={false}
features={[
{
id: 1,
title: "Empresas Publican Ofertas",
description: "Restaurantes, hoteles y empresas de eventos crean ofertas de trabajo con detalles específicos, horarios y requerimientos en minutos.",
imageSrc: "http://img.b2bpic.net/free-vector/medical-booking-application-interface_23-2148569125.jpg?_wi=2",
imageAlt: "Empresas publicando ofertas de trabajo",
},
{
id: 2,
title: "Trabajadores Se Postulan",
description: "Personal calificado accede a ofertas disponibles, revisa perfiles verificados y se postula para posiciones que se adapten a su disponibilidad.",
imageSrc: "http://img.b2bpic.net/free-photo/hr-employers-analyzing-candidate-cv-after-job-interview_482257-101456.jpg?_wi=2",
imageAlt: "Trabajadores explorando oportunidades",
},
{
id: 3,
title: "Contratación Instantánea",
description: "Las empresas confirman al personal seleccionado y reciben detalles completos del trabajador. Todo se sincroniza automáticamente en tiempo real.",
imageSrc: "http://img.b2bpic.net/free-photo/closeup-happy-woman-using-mobile-phone-text-messaging-night-home_637285-4411.jpg?_wi=2",
imageAlt: "Confirmación instantánea de contratación",
},
]}
/>
</div>
<div id="businesses" data-section="businesses">
<FeatureCardSeven
title="Beneficios Para Empresas"
description="Acceso inmediato a talento verificado, control total del proceso y herramientas que automatizan tu gestión de personal."
tag="Control Absoluto"
tagIcon={CheckCircle}
tagAnimation="slide-up"
buttons={[
{
text: "Comienza Ahora",
href: "/signup?type=business",
},
]}
buttonAnimation="slide-up"
textboxLayout="split"
animationType="slide-up"
useInvertedBackground={false}
features={[
{
id: 1,
title: "Acceso Instantáneo a Talento",
description: "Encuentra y contrata personal en cuestión de horas, no días. Gextras te conecta con profesionales verificados y disponibles.",
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-people-working-together-office_23-2149307826.jpg?_wi=2",
imageAlt: "Acceso rápido a talento verificado",
},
{
id: 2,
title: "Gestión Organizada",
description: "Gestiona ofertas, aplicantes, contratos y nóminas desde un único dashboard intuitivo. Sin papeleos, solo eficiencia.",
imageSrc: "http://img.b2bpic.net/free-photo/chef-working-together-professional-kitchen_23-2149727979.jpg?_wi=2",
imageAlt: "Panel de control de gestión de personal",
},
]}
/>
</div>
<div id="workers" data-section="workers">
<FeatureCardSeven
title="Oportunidades Para Trabajadores"
description="Trabaja cuando quieras, donde quieras. Gextras te conecta con empresas de prestigio que valoran tu experiencia."
tag="Libertad Profesional"
tagIcon={Award}
tagAnimation="slide-up"
buttons={[
{
text: "Únete a Gextras",
href: "/signup?type=worker",
},
]}
buttonAnimation="slide-up"
textboxLayout="split"
animationType="slide-up"
useInvertedBackground={false}
features={[
{
id: 1,
title: "Flexibilidad Total",
description: "Elige los trabajos que se adapten a tu horario. Sin contratos fijos. Tú tienes el control de tu disponibilidad.",
imageSrc: "http://img.b2bpic.net/free-photo/store-mockup-device-used-as-advertising_482257-76227.jpg?_wi=2",
imageAlt: "Trabajador eligiendo sus propias oportunidades",
},
{
id: 2,
title: "Ingresos Confiables",
description: "Gana dinero consistente a través de trabajos verificados y pagos garantizados. Tu experiencia vale.",
imageSrc: "http://img.b2bpic.net/free-photo/mobile-payment_1098-16079.jpg?_wi=2",
imageAlt: "Sistema de pagos seguro y rápido",
},
]}
/>
</div>
<div id="social-proof" data-section="social-proof">
<SocialProofOne
names={[
"Restaurantes Premium",
"Cadenas Hoteleras",
"Organizadores de Eventos",
"Catering Profesional",
"Espacios de Eventos",
"Agencias de Viajes",
"Plataformas Digitales",
]}
logos={[
"http://img.b2bpic.net/free-vector/elegant-golden-furniture-logo-template_23-2148457950.jpg",
"http://img.b2bpic.net/free-vector/hotel-logo-black-business-corporate-identity-set_53876-114181.jpg",
"http://img.b2bpic.net/free-vector/flat-elegant-business-card-template_23-2148234505.jpg",
"http://img.b2bpic.net/free-vector/set-linear-flat-catering-logos_23-2149008813.jpg",
"http://img.b2bpic.net/free-psd/international-yoga-day-invitation-template_23-2150393756.jpg",
"http://img.b2bpic.net/free-vector/travel-sticker-collection-70s-style_23-2148393493.jpg",
"http://img.b2bpic.net/free-psd/flat-design-fashion-template_23-2150295080.jpg",
]}
title="Confían en Gextras"
description="Miles de empresas líderes en hospitalidad ya optimizan su gestión de personal con nuestra plataforma inteligente."
tag="Confianza Comprobada"
tagIcon={Shield}
tagAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={false}
speed={40}
showCard={true}
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardTen
title="Impacto Real"
description="Números que hablan de nuestra efectividad en conectar talento con oportunidades."
tag="Resultados Comprobados"
tagIcon={TrendingUp}
tagAnimation="slide-up"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
metrics={[
{
id: "coverage",
title: "Ofertas Cubiertas",
subtitle: "en menos de 2 horas",
category: "Velocidad",
value: "95%",
},
{
id: "workers",
title: "Trabajadores Activos",
subtitle: "verificados y confiables",
category: "Comunidad",
value: "50K+",
},
{
id: "satisfaction",
title: "Satisfacción Empresas",
subtitle: "según nuestras encuestas",
category: "Calidad",
value: "4.9/5",
},
{
id: "saved",
title: "Horas Ahorradas",
subtitle: "en gestión mensual",
category: "Eficiencia",
value: "200K",
},
]}
/>
</div>
<div id="faq" data-section="faq">
<FaqDouble
title="Preguntas Frecuentes"
description="Encuentra respuestas rápidas sobre cómo funciona Gextras, seguridad y cómo comenzar."
tag="Soporte Disponible"
tagIcon={HelpCircle}
tagAnimation="slide-up"
buttons={[
{
text: "¿Más Dudas?",
href: "/login",
},
]}
buttonAnimation="slide-up"
textboxLayout="default"
animationType="smooth"
faqsAnimation="blur-reveal"
useInvertedBackground={false}
faqs={[
{
id: "faq-1",
title: "¿Cómo verifican a los trabajadores?",
content: "Todos nuestros trabajadores pasan por un proceso de verificación de identidad, antecedentes y referencias profesionales. Nos aseguramos de que cada perfil sea confiable antes de conectarlo con empresas.",
},
{
id: "faq-2",
title: "¿Cuál es el costo para las empresas?",
content: "Ofrecemos un modelo flexible con comisiones transparentes por cada contratación exitosa. No hay cuotas mensuales ocultas. Contacta a nuestro equipo para planes personalizados.",
},
{
id: "faq-3",
title: "¿Cómo reciben pago los trabajadores?",
content: "Los trabajadores reciben pagos automáticos después de cada jornada completada. Transferencias directas a su cuenta bancaria sin demoras.",
},
{
id: "faq-4",
title: "¿Puedo cancelar una contratación?",
content: "Las políticas de cancelación dependen del momento. Contáctanos para detalles específicos, pero siempre protegemos ambos lados del acuerdo.",
},
{
id: "faq-5",
title: "¿Es segura mi información en Gextras?",
content: "Usamos encriptación de nivel empresarial y cumplimos con todas las regulaciones de protección de datos. Tu privacidad es nuestra prioridad máxima.",
},
{
id: "faq-6",
title: "¿En qué ciudades operamos?",
content: "Comenzamos en ciudades principales españolas con planes de expansión. Verifica la disponibilidad en tu zona al registrarte en nuestra plataforma.",
},
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactCenter
tag="Conectemos"
title="¿Listo Para Transformar Tu Gestión de Personal?"
description="Únete a miles de empresas y trabajadores que ya están aprovechando la velocidad y eficiencia de Gextras. Comienza hoy."
tagIcon={Mail}
tagAnimation="slide-up"
background={{
variant: "radial-gradient",
}}
useInvertedBackground={false}
inputPlaceholder="Tu correo profesional"
buttonText="Comienza Ahora"
termsText="Al registrarte, aceptas nuestros Términos de Servicio y Política de Privacidad. Nos comprometemos a tu confianza."
onSubmit={handleContactSubmit}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="Gextras"
leftLink={{
text: "Política de Privacidad",
href: "#",
}}
rightLink={{
text: "Términos de Servicio",
href: "#",
}}
/>
</div>
</ThemeProvider>
);
}