Merge version_2 into main #1
307
src/app/page.tsx
307
src/app/page.tsx
@@ -2,16 +2,16 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import BlogCardOne from '@/components/sections/blog/BlogCardOne';
|
||||
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
||||
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
||||
import FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';
|
||||
import FooterBase from '@/components/sections/footer/FooterBase';
|
||||
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
|
||||
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
||||
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
import BlogCardThree from '@/components/sections/blog/BlogCardThree';
|
||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||||
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
||||
import FeatureCardTwentyEight from '@/components/sections/feature/FeatureCardTwentyEight';
|
||||
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
||||
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
||||
import MetricCardSeven from '@/components/sections/metric/MetricCardSeven';
|
||||
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
|
||||
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
||||
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
@@ -29,300 +29,111 @@ export default function LandingPage() {
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Features",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "Blog",
|
||||
id: "blog",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Features", id: "features" },
|
||||
{ name: "Blog", id: "blog" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="SPTKW"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroLogoBillboard
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
logoText="SPTKW"
|
||||
description="Innovating the future of enterprise technology with scalable solutions, deep insights, and secure, efficient infrastructure."
|
||||
buttons={[
|
||||
{
|
||||
text: "Learn More",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
text: "Contact Us",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
<HeroBillboard
|
||||
title="Innovating the future of enterprise technology"
|
||||
description="Scalable solutions, deep insights, and secure infrastructure designed for modern growth."
|
||||
background={{ variant: "gradient-bars" }}
|
||||
buttons={[{ text: "Learn More", href: "#about" }, { text: "Contact Us", href: "#contact" }]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/businesswoman-looking-company-charts_482257-124401.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<MetricSplitMediaAbout
|
||||
<InlineImageSplitTextAbout
|
||||
heading={[{ type: 'text', content: "Empowering Businesses Through Data" }]}
|
||||
buttons={[{ text: "Read More" }]}
|
||||
useInvertedBackground={false}
|
||||
title="Empowering Businesses Through Data"
|
||||
description="With over a decade of experience in the technology sector, SPTKW provides the tools and strategy necessary for digital transformation in modern business landscapes."
|
||||
metrics={[
|
||||
{
|
||||
value: "15+",
|
||||
title: "Years Experience",
|
||||
},
|
||||
{
|
||||
value: "200+",
|
||||
title: "Projects Completed",
|
||||
},
|
||||
{
|
||||
value: "99%",
|
||||
title: "Client Retention",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/lifestyle-people-office_23-2149173766.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardMedia
|
||||
<FeatureCardTwentyEight
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "1",
|
||||
title: "Integration",
|
||||
description: "Seamless data and system integration.",
|
||||
tag: "Core",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-frame-background-connecting-dots-digital-network-design_53876-153345.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Security",
|
||||
description: "Robust cybersecurity for modern enterprises.",
|
||||
tag: "Essential",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/computer-safety-technology-icon_53876-118352.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Scalability",
|
||||
description: "Growth-oriented infrastructure solutions.",
|
||||
tag: "Strategic",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/urban-development-economic-growth-with-financial-chart-overlay_84443-73900.jpg",
|
||||
},
|
||||
]}
|
||||
title="Comprehensive Technical Services"
|
||||
description="Tailored solutions to optimize performance, enhance security, and drive innovation."
|
||||
description="Tailored solutions for your digital transformation."
|
||||
features={[
|
||||
{ id: "1", title: "Integration", subtitle: "Seamless connectivity", category: "Core", value: "High" },
|
||||
{ id: "2", title: "Security", subtitle: "Robust defense", category: "Essential", value: "Max" },
|
||||
{ id: "3", title: "Scalability", subtitle: "Growth-oriented", category: "Strategic", value: "Stable" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardEleven
|
||||
<MetricCardSeven
|
||||
animationType="slide-up"
|
||||
title="Industry Impact Metrics"
|
||||
description="Measuring performance across our core competencies."
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "1",
|
||||
value: "50+",
|
||||
title: "Daily Reports",
|
||||
description: "In-depth analytics for efficiency.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/chalk-arrows-drawn-with-copy-space_23-2148456145.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
value: "1.2M",
|
||||
title: "Queries Processed",
|
||||
description: "High-volume data processing.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blurred-night-lights_23-2148139345.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
value: "45%",
|
||||
title: "Cost Optimization",
|
||||
description: "Saving through automation.",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/infographic-elements-collection_23-2148037415.jpg",
|
||||
},
|
||||
{ id: "1", value: "15+", title: "Years Experience", items: ["Proven record", "Reliable"] },
|
||||
{ id: "2", value: "200+", title: "Projects Completed", items: ["Global clients", "Diverse"] },
|
||||
{ id: "3", value: "99%", title: "Retention Rate", items: ["Customer focus", "Long-term"] }
|
||||
]}
|
||||
title="Data Driven Excellence"
|
||||
description="Measuring our impact across the industry."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="social-proof" data-section="social-proof">
|
||||
<SocialProofOne
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"Microsoft",
|
||||
"Google",
|
||||
"AWS",
|
||||
"Oracle",
|
||||
"IBM",
|
||||
"Intel",
|
||||
"Cisco",
|
||||
]}
|
||||
title="Trusted By Industry Leaders"
|
||||
description="Our global partnerships demonstrate our reach and reliability."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitMedia
|
||||
<FaqDouble
|
||||
title="Frequently Asked Questions"
|
||||
description="Clear answers to your most common questions."
|
||||
textboxLayout="split"
|
||||
faqsAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "How do we get started?",
|
||||
content: "Book an initial consultation to discuss your specific needs.",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Do you offer support?",
|
||||
content: "Yes, we provide 24/7 technical and strategic support.",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "How is security handled?",
|
||||
content: "We follow global security best practices at all stages.",
|
||||
},
|
||||
{ id: "1", title: "How do we get started?", content: "Book a consultation today." },
|
||||
{ id: "2", title: "Do you offer support?", content: "24/7 dedicated support." },
|
||||
{ id: "3", title: "How is security handled?", content: "Global best practices applied." }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/beautiful-customer-support-representative-wearing-headset-while-working-call-center_637285-133.jpg"
|
||||
title="Frequently Asked Questions"
|
||||
description="Answers to commonly asked questions about our technology services."
|
||||
faqsAnimation="slide-up"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="blog" data-section="blog">
|
||||
<BlogCardOne
|
||||
<BlogCardThree
|
||||
animationType="slide-up"
|
||||
title="Latest Insights"
|
||||
description="Expert perspectives on industry trends."
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
title="Latest Insights"
|
||||
description="Stay updated with our latest industry news and expert opinions."
|
||||
blogs={[
|
||||
{
|
||||
id: "1",
|
||||
category: "Tech News",
|
||||
title: "Future of Enterprise AI",
|
||||
excerpt: "Exploring the implications of AI on modern enterprise.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-laptop-with-coffee_23-2148377713.jpg",
|
||||
authorName: "Jane Doe",
|
||||
authorAvatar: "asset://avatar-1",
|
||||
date: "Jan 20, 2025",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
category: "Strategy",
|
||||
title: "Digital Transformation Roadmap",
|
||||
excerpt: "How to plan your journey towards total digital efficiency.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-abstract-network-technology-background-with-low-poly-plexus-design_1048-18867.jpg",
|
||||
authorName: "Jane Doe",
|
||||
authorAvatar: "asset://avatar-1",
|
||||
date: "Feb 05, 2025",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
category: "Security",
|
||||
title: "Zero Trust Architectures",
|
||||
excerpt: "Building a secure future for global organizations.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/speaker-talking-tech-conference-exploring-latest-ai-technology-trends_482257-105806.jpg",
|
||||
authorName: "Jane Doe",
|
||||
authorAvatar: "asset://avatar-1",
|
||||
date: "Mar 10, 2025",
|
||||
},
|
||||
{ id: "1", category: "Tech", title: "Enterprise AI", excerpt: "Trends in AI.", imageSrc: "", authorName: "Admin", authorAvatar: "", date: "2025" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Get in touch"
|
||||
title="Ready to Transform Your Business?"
|
||||
description="Our team is ready to discuss how SPTKW can help you reach your goals."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Us",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
<ContactCenter
|
||||
tag="Contact"
|
||||
title="Start Your Journey"
|
||||
description="Get in touch for a tailored solution."
|
||||
background={{ variant: "plain" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Blog",
|
||||
href: "#blog",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
{
|
||||
label: "Integration",
|
||||
href: "#features",
|
||||
},
|
||||
{
|
||||
label: "Security",
|
||||
href: "#features",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#contact",
|
||||
},
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#faq",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
<FooterLogoEmphasis
|
||||
logoText="SPTKW"
|
||||
columns={[
|
||||
{ items: [{ label: "About" }, { label: "Features" }] },
|
||||
{ items: [{ label: "Contact" }, { label: "Support" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user