Merge version_1 into main #3
213
src/app/page.tsx
213
src/app/page.tsx
@@ -4,7 +4,7 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||||
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
||||
import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
|
||||
import FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';
|
||||
import FooterBase from '@/components/sections/footer/FooterBase';
|
||||
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
@@ -25,136 +25,99 @@ export default function LandingPage() {
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "Home", id: "/"},
|
||||
{
|
||||
name: "Pricing", id: "/pricing"},
|
||||
{
|
||||
name: "Dashboard", id: "/dashboard"},
|
||||
]}
|
||||
brandName="DataDirect"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Pricing", id: "/pricing" },
|
||||
{ name: "Dashboard", id: "/dashboard" },
|
||||
]}
|
||||
brandName="DataDirect"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{
|
||||
variant: "gradient-bars"}}
|
||||
title="Instant Data Delivery"
|
||||
description="Get affordable and reliable data plans for all networks instantly. Reliable service, 24/7 delivery."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Started", href: "/dashboard"},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-abstract-background-with-network-connections-low-poly-plexus-design_1048-11867.jpg", imageAlt: "digital network abstract"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-network_23-2152020920.jpg", imageAlt: "digital network abstract"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-background-concept_1194-617406.jpg", imageAlt: "digital network abstract"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/conceptual-3d-illustration-basketball-player-dunking-motion-design_183364-124108.jpg", imageAlt: "digital network abstract"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/technology-network-background-connection-cyber-space-ai-generative_123827-24187.jpg", imageAlt: "digital network abstract"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/connecting-dots-background-network-communication-design_53876-160215.jpg", imageAlt: "digital network abstract"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="Instant Data Delivery"
|
||||
description="Get affordable and reliable data plans for all networks instantly. Reliable service, 24/7 delivery."
|
||||
buttons={[{ text: "Get Started", href: "/dashboard" }]}
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/3d-abstract-background-with-network-connections-low-poly-plexus-design_1048-11867.jpg", imageAlt: "digital network abstract" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-network_23-2152020920.jpg", imageAlt: "digital network abstract" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/abstract-technology-background-concept_1194-617406.jpg", imageAlt: "digital network abstract" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/conceptual-3d-illustration-basketball-player-dunking-motion-design_183364-124108.jpg", imageAlt: "digital network abstract" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/technology-network-background-connection-cyber-space-ai-generative_123827-24187.jpg", imageAlt: "digital network abstract" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/connecting-dots-background-network-communication-design_53876-160215.jpg", imageAlt: "digital network abstract" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
title="Why Choose Us?"
|
||||
description="We offer the most reliable VTU services in the market today with competitive pricing and instant delivery times."
|
||||
bulletPoints={[
|
||||
{
|
||||
title: "Instant Delivery", description: "Get your data instantly."},
|
||||
{
|
||||
title: "24/7 Support", description: "Always here to help."},
|
||||
{
|
||||
title: "Competitive Rates", description: "Affordable data plans."},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/modern-stationary-collection-arrangement_23-2149309685.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
imageAlt="tech professional working"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
title="Why Choose Us?"
|
||||
description="We offer the most reliable VTU services in the market today with competitive pricing and instant delivery times."
|
||||
bulletPoints={[
|
||||
{ title: "Instant Delivery", description: "Get your data instantly." },
|
||||
{ title: "24/7 Support", description: "Always here to help." },
|
||||
{ title: "Competitive Rates", description: "Affordable data plans." },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/modern-stationary-collection-arrangement_23-2149309685.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
imageAlt="tech professional working"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1", title: "Is it instant?", content: "Yes, delivery is within seconds."},
|
||||
{
|
||||
id: "q2", title: "What networks?", content: "MTN, Glo, Airtel, 9Mobile."},
|
||||
{
|
||||
id: "q3", title: "Need help?", content: "Contact support via WhatsApp."},
|
||||
]}
|
||||
sideTitle="Questions?"
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "q1", title: "Is it instant?", content: "Yes, delivery is within seconds." },
|
||||
{ id: "q2", title: "What networks?", content: "MTN, Glo, Airtel, 9Mobile." },
|
||||
{ id: "q3", title: "Need help?", content: "Contact support via WhatsApp." },
|
||||
]}
|
||||
sideTitle="Questions?"
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="feature" data-section="feature">
|
||||
<FeatureCardSixteen
|
||||
title="Features"
|
||||
description="Our core capabilities"
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[]}
|
||||
/>
|
||||
</div>
|
||||
<div id="feature" data-section="feature">
|
||||
<FeatureCardMedia
|
||||
title="Features"
|
||||
description="Our core capabilities"
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Contact Us"
|
||||
description="Need technical assistance or help with your transactions?"
|
||||
inputs={[
|
||||
{
|
||||
name: "name", type: "text", placeholder: "Your Name", required: true,
|
||||
},
|
||||
{
|
||||
name: "email", type: "email", placeholder: "Your Email", required: true,
|
||||
},
|
||||
]}
|
||||
textarea={{
|
||||
name: "message", placeholder: "Tell us how we can help", rows: 4,
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/business-office-sence_1387-652.jpg"
|
||||
imageAlt="business office sence"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Contact Us"
|
||||
description="Need technical assistance or help with your transactions?"
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Your Email", required: true },
|
||||
]}
|
||||
textarea={{ name: "message", placeholder: "Tell us how we can help", rows: 4 }}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/business-office-sence_1387-652.jpg"
|
||||
imageAlt="business office sence"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Links", items: [
|
||||
{
|
||||
label: "Home", href: "/"},
|
||||
{
|
||||
label: "Dashboard", href: "/dashboard"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support", items: [
|
||||
{
|
||||
label: "Contact", href: "#contact"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="DataDirect"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{ title: "Links", items: [{ label: "Home", href: "/" }, { label: "Dashboard", href: "/dashboard" }] },
|
||||
{ title: "Support", items: [{ label: "Contact", href: "#contact" }] },
|
||||
]}
|
||||
logoText="DataDirect"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user