Merge version_2 into main #2
259
src/app/page.tsx
259
src/app/page.tsx
@@ -3,15 +3,15 @@
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import AboutMetric from '@/components/sections/about/AboutMetric';
|
||||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||||
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||
import FaqBase from '@/components/sections/faq/FaqBase';
|
||||
import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import FooterCard from '@/components/sections/footer/FooterCard';
|
||||
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
|
||||
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
|
||||
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
|
||||
import { Award, CheckCircle, Shield, Star, TrendingUp, Zap } from "lucide-react";
|
||||
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
||||
import { Award, CheckCircle, Shield, Star, TrendingUp, Zap, MessageSquare, Phone } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -31,22 +31,10 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
{
|
||||
name: "Features",
|
||||
id: "#features",
|
||||
},
|
||||
{
|
||||
name: "Pricing",
|
||||
id: "#pricing",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
{ name: "About", id: "#about" },
|
||||
{ name: "Features", id: "#features" },
|
||||
{ name: "Metrics", id: "#metrics" },
|
||||
{ name: "Contact", id: "#contact" },
|
||||
]}
|
||||
brandName="InnovatePro"
|
||||
/>
|
||||
@@ -54,17 +42,10 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Empowering Your Digital Transformation"
|
||||
description="We deliver high-end software solutions designed to scale your business and streamline your operations with modern, intuitive design."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Started",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Empowering Your Digital Transformation / Transformación Digital"
|
||||
description="We deliver high-end software solutions designed to scale your business and streamline your operations with modern, intuitive design. / Entregamos soluciones de software de alta gama diseñadas para escalar su negocio y optimizar sus operaciones."
|
||||
buttons={[{ text: "Get Started / Empezar", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/modern-office-space-with-futuristic-decor-furniture_23-2151797748.jpg?_wi=1"
|
||||
imageAlt="Hero digital software interface"
|
||||
/>
|
||||
@@ -73,23 +54,11 @@ export default function LandingPage() {
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
useInvertedBackground={true}
|
||||
title="Why Choose InnovatePro?"
|
||||
title="Why Choose InnovatePro? / ¿Por qué elegir InnovatePro?"
|
||||
metrics={[
|
||||
{
|
||||
icon: CheckCircle,
|
||||
label: "Projects Completed",
|
||||
value: "200+",
|
||||
},
|
||||
{
|
||||
icon: Shield,
|
||||
label: "Security Compliance",
|
||||
value: "100%",
|
||||
},
|
||||
{
|
||||
icon: Zap,
|
||||
label: "Avg. Speed Boost",
|
||||
value: "45%",
|
||||
},
|
||||
{ icon: CheckCircle, label: "Projects / Proyectos", value: "200+" },
|
||||
{ icon: Shield, label: "Security / Seguridad", value: "100%" },
|
||||
{ icon: Zap, label: "Performance / Rendimiento", value: "45%" },
|
||||
]}
|
||||
metricsAnimation="blur-reveal"
|
||||
/>
|
||||
@@ -100,198 +69,74 @@ export default function LandingPage() {
|
||||
animationType="depth-3d"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
negativeCard={{
|
||||
items: [
|
||||
"Legacy overhead",
|
||||
"Slow deployment cycles",
|
||||
"Unsecured data silos",
|
||||
],
|
||||
}}
|
||||
positiveCard={{
|
||||
items: [
|
||||
"Seamless automation",
|
||||
"Scalable cloud architecture",
|
||||
"Enterprise-grade security",
|
||||
],
|
||||
}}
|
||||
title="Modern Solutions, Real Results"
|
||||
description="Our robust feature set helps you focus on what matters most—growth and user satisfaction."
|
||||
negativeCard={{ items: ["Legacy overhead / Sistemas obsoletos", "Slow deployment / Despliegue lento", "Security risks / Riesgos de seguridad"] }}
|
||||
positiveCard={{ items: ["Automation / Automatización", "Scalable Cloud / Nube escalable", "Enterprise Security / Seguridad empresarial"] }}
|
||||
title="Modern Solutions, Real Results / Soluciones Modernas, Resultados Reales"
|
||||
description="Helping you grow effectively. / Ayudándole a crecer de manera efectiva."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardThree
|
||||
animationType="depth-3d"
|
||||
<MetricCardEleven
|
||||
animationType="blur-reveal"
|
||||
title="Proven Scalability / Escalabilidad Probada"
|
||||
description="Numbers speak for our performance across all global markets. / Los números hablan de nuestro desempeño en todos los mercados globales."
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
icon: Star,
|
||||
title: "Client Satisfaction",
|
||||
value: "99%",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
icon: Award,
|
||||
title: "Industry Awards",
|
||||
value: "15",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
icon: TrendingUp,
|
||||
title: "ROI Delivered",
|
||||
value: "3.5x",
|
||||
},
|
||||
{ id: "m1", title: "Satisfaction / Satisfacción", value: "99%", description: "High client retention. / Alta retención.", imageSrc: "https://img.b2bpic.net/free-photo/digital-marketing-concept_23-2149157297.jpg" },
|
||||
{ id: "m2", title: "Awards / Premios", value: "15", description: "Industry recognition. / Reconocimiento.", imageSrc: "https://img.b2bpic.net/free-photo/gold-trophy-dark-background_23-2149021235.jpg" }
|
||||
]}
|
||||
title="Proven Scalability"
|
||||
description="Numbers speak for our performance and reliability across all sectors."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardOne
|
||||
animationType="scale-rotate"
|
||||
<TestimonialCardFive
|
||||
title="Trusted by Industry Leaders / Líderes de la industria"
|
||||
description="Our clients share their success stories. / Historias de éxito de nuestros clientes."
|
||||
textboxLayout="split"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah Miller",
|
||||
role: "CTO",
|
||||
company: "TechStream",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/cleaning-hand-drawn-icons-set-infographics-mobile-uxui-kit-print-design-include-brush-brushing-clean-scrub-plunger-restroom-toilet-tool-icon-set-vector_1057-11436.jpg",
|
||||
imageAlt: "minimalist business tech icon set",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "James Chen",
|
||||
role: "Product Lead",
|
||||
company: "GlobalFlow",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-office-space-with-futuristic-decor-furniture_23-2151797748.jpg?_wi=2",
|
||||
imageAlt: "minimalist business tech icon set",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Elena Rodriguez",
|
||||
role: "CEO",
|
||||
company: "InnovateHub",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/desk-arrangement-with-laptop_23-2148883522.jpg?_wi=1",
|
||||
imageAlt: "minimalist business tech icon set",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David Kim",
|
||||
role: "Ops Manager",
|
||||
company: "CloudNext",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/futuristic-school-classroom-future-students_23-2150906124.jpg",
|
||||
imageAlt: "minimalist business tech icon set",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Lisa Wang",
|
||||
role: "Director",
|
||||
company: "StartupGen",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-office-space-with-futuristic-decor-furniture_23-2151797672.jpg",
|
||||
imageAlt: "minimalist business tech icon set",
|
||||
},
|
||||
{ id: "1", name: "Sarah Miller", date: "2024-05", title: "CTO", quote: "Exceptional delivery. / Entrega excepcional.", tag: "Enterprise", avatarSrc: "https://i.pravatar.cc/100?u=1", imageSrc: "https://img.b2bpic.net/free-photo/people-working-office_23-2149021255.jpg" }
|
||||
]}
|
||||
title="Trusted by Industry Leaders"
|
||||
description="Hear directly from the partners and clients who drive our progress."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={true}
|
||||
<FaqBase
|
||||
title="Questions? / ¿Preguntas?"
|
||||
description="Get the answers you need in English or Spanish. / Encuentre respuestas en inglés o español."
|
||||
faqsAnimation="blur-reveal"
|
||||
textboxLayout="split"
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "How long does implementation take?",
|
||||
content: "Usually 4-6 weeks depending on project scope.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Do you provide support?",
|
||||
content: "Yes, we offer 24/7 dedicated support for all our clients.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Is the system scalable?",
|
||||
content: "Absolutely, our architecture is built for infinite growth.",
|
||||
},
|
||||
{ id: "f1", title: "How long? / ¿Cuánto tiempo?", content: "4-6 weeks / 4-6 semanas" },
|
||||
{ id: "f2", title: "Support? / ¿Soporte?", content: "24/7 global support / Soporte global 24/7" }
|
||||
]}
|
||||
sideTitle="Common Questions"
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
<ContactSplit
|
||||
tag="Contact"
|
||||
title="Let's Innovate Together / Innovamos Juntos"
|
||||
description="Reach out in your preferred language. / Contáctenos en su idioma preferido."
|
||||
background={{ variant: "animated-grid" }}
|
||||
useInvertedBackground={false}
|
||||
title="Ready to Transform?"
|
||||
description="Get in touch with our team today and let's start your journey toward innovation."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Work Email",
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "How can we help you?",
|
||||
rows: 4,
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/desk-arrangement-with-laptop_23-2148883522.jpg?_wi=2"
|
||||
imageSrc="https://img.b2bpic.net/free-photo/close-up-businessman-shaking-hands_23-2149021288.jpg"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoEmphasis
|
||||
columns={[
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Features",
|
||||
href: "#features",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{
|
||||
label: "Privacy Policy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms of Service",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
<FooterCard
|
||||
logoText="InnovatePro"
|
||||
copyrightText="© 2025 InnovatePro | Global Solutions"
|
||||
socialLinks={[
|
||||
{ icon: MessageSquare, href: "#", ariaLabel: "Social" },
|
||||
{ icon: Phone, href: "#", ariaLabel: "Phone" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user