Merge version_2 into main #4
339
src/app/page.tsx
339
src/app/page.tsx
@@ -2,264 +2,117 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import AboutMetric from '@/components/sections/about/AboutMetric';
|
||||
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
||||
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
||||
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
|
||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
|
||||
import { Monitor, Bot, Pencil, Video, Search, Share2 } from "lucide-react";
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
|
||||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||||
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
|
||||
import { BarChart, Lightbulb, Zap } from "lucide-react";
|
||||
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
|
||||
import AboutMetric from '@/components/sections/about/AboutMetric';
|
||||
import FeatureBento from '@/components/sections/feature/FeatureBento';
|
||||
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
|
||||
import ContactText from '@/components/sections/contact/ContactText';
|
||||
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="hover-magnetic"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="rounded"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="pill"
|
||||
contentWidth="mediumLarge"
|
||||
sizing="mediumLarge"
|
||||
background="circleGradient"
|
||||
cardStyle="gradient-mesh"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="solid"
|
||||
headingFontWeight="light"
|
||||
sizing="largeSizeMediumTitles"
|
||||
background="noiseDiagonalGradient"
|
||||
cardStyle="glass-depth"
|
||||
primaryButtonStyle="primary-glow"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "About", id: "about"},
|
||||
{
|
||||
name: "Features", id: "features"},
|
||||
{
|
||||
name: "Pricing", id: "pricing"},
|
||||
{
|
||||
name: "Contact", id: "contact"},
|
||||
]}
|
||||
brandName="Advertise Media"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Services", id: "features" },
|
||||
{ name: "Case Studies", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Advertise Media"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitKpi
|
||||
background={{
|
||||
variant: "gradient-bars"}}
|
||||
title="Revolutionize Marketing with AI-Driven Intelligence"
|
||||
description="Advertise Media transforms your digital presence through predictive analytics and AI-powered performance strategies."
|
||||
kpis={[
|
||||
{
|
||||
value: "450%", label: "Revenue Growth"},
|
||||
{
|
||||
value: "12ms", label: "Response Time"},
|
||||
{
|
||||
value: "99.9%", label: "Client Success"},
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
buttons={[
|
||||
{
|
||||
text: "Get Started", href: "#contact"},
|
||||
{
|
||||
text: "View Features", href: "#features"},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/researcher-using-transparent-digital-tablet-screen-futuristic-technology_53876-101147.jpg?_wi=1"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/old-couturier-checking-fashion-sketches-atelier-working-modern-designs-with-laptop-tablet-experienced-designer-searching-handmade-models-online-needlework-handheld-shot_482257-67826.jpg", alt: "AI analyst"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/futuristic-ai-dashboard-display_23-2151977856.jpg", alt: "Data expert"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/futuristic-ai-data-visualization_23-2151977857.jpg", alt: "Performance lead"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/man-with-vr-headset-touching-holographic-screen_53876-101150.jpg", alt: "AI strategist"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/3d-modern-background-with-flowing-particles_1048-16341.jpg", alt: "Tech consultant"},
|
||||
]}
|
||||
avatarText="Trusted by 500+ global brands"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text", text: "Predictive Analytics"},
|
||||
{
|
||||
type: "text", text: "Automated Scaling"},
|
||||
{
|
||||
type: "text", text: "Real-time Bidding"},
|
||||
{
|
||||
type: "text", text: "Content Generation"},
|
||||
{
|
||||
type: "text", text: "Performance AdOps"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitKpi
|
||||
title="We Build Digital Experiences That Convert"
|
||||
description="High-end digital agency delivering AI-driven performance strategies and immersive experiences."
|
||||
background={{ variant: "glowing-orb" }}
|
||||
buttons={[{ text: "Let's Connect", href: "#contact" }]}
|
||||
kpis={[
|
||||
{ value: "500+", label: "Projects Completed" },
|
||||
{ value: "99%", label: "Client Satisfaction" },
|
||||
{ value: "24/7", label: "Global Support" }
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
useInvertedBackground={true}
|
||||
title="Agency Precision Metrics"
|
||||
metrics={[
|
||||
{
|
||||
icon: Lightbulb,
|
||||
label: "Neural Network Models", value: "50+"},
|
||||
{
|
||||
icon: BarChart,
|
||||
label: "Live Ad Campaigns", value: "1200+"},
|
||||
{
|
||||
icon: Zap,
|
||||
label: "Real-time Optimizations", value: "24/7"},
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="features" data-section="features">
|
||||
<FeatureBento
|
||||
title="Comprehensive Digital Services"
|
||||
description="Everything your brand needs to scale, managed by experts."
|
||||
useInvertedBackground={true}
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
features={[
|
||||
{ title: "Web Development", description: "High-performance web architecture.", bentoComponent: 'reveal-icon', icon: Monitor },
|
||||
{ title: "AI Receptionist", description: "24/7 intelligent customer engagement.", bentoComponent: 'reveal-icon', icon: Bot },
|
||||
{ title: "Graphic Designing", description: "Visual identity that commands attention.", bentoComponent: 'reveal-icon', icon: Pencil },
|
||||
{ title: "Video Editing", description: "Compelling visual storytelling.", bentoComponent: 'reveal-icon', icon: Video },
|
||||
{ title: "Meta/Google Ads", description: "Data-driven ROI campaigns.", bentoComponent: 'reveal-icon', icon: Search },
|
||||
{ title: "Social Media Management", description: "Brand growth across all platforms.", bentoComponent: 'reveal-icon', icon: Share2 },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<FeatureCardNineteen
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
tag: "AI", title: "Predictive Content", subtitle: "GenAI Strategy", description: "Automated content generation tuned to your brand personality.", imageSrc: "http://img.b2bpic.net/free-photo/3d-network-communications-background-with-flowing-floating-particles_1048-12199.jpg?_wi=1"},
|
||||
{
|
||||
tag: "Data", title: "Real-time Analytics", subtitle: "Deep Insights", description: "Understand your customers better with advanced behavioural analytics.", imageSrc: "http://img.b2bpic.net/free-photo/woman-enjoying-her-virtual-date_23-2149307271.jpg"},
|
||||
{
|
||||
tag: "Scale", title: "Performance AdOps", subtitle: "Auto Scaling", description: "Intelligent bid management across global advertising platforms.", imageSrc: "http://img.b2bpic.net/free-vector/polygonal-infographic-with-bar-graph-options_1092-1.jpg"},
|
||||
]}
|
||||
title="Smart Marketing Solutions"
|
||||
description="Our AI-driven ecosystem empowers brands to scale exponentially."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
title="Case Studies & Results"
|
||||
description="See how we accelerate growth for premium brands."
|
||||
animationType="depth-3d"
|
||||
showRating={true}
|
||||
textboxLayout="split"
|
||||
testimonials={[
|
||||
{ id: "1", name: "TechCorp", handle: "@tech", testimonial: "The web redesign increased our conversion by 200% within two months.", rating: 5 },
|
||||
{ id: "2", name: "FashionHub", handle: "@fashion", testimonial: "Their video content strategy elevated our social media presence significantly.", rating: 5 },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<PricingCardNine
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
plans={[
|
||||
{
|
||||
id: "basic", title: "Essential", price: "$1,999", period: "/mo", features: [
|
||||
"AI Ad Copywriting", "Dashboard Access", "Weekly Insights"],
|
||||
button: {
|
||||
text: "Choose Basic", href: "#contact"},
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=2d7i1h", imageAlt: "minimalist tech company logo vector"},
|
||||
{
|
||||
id: "pro", title: "Performance", price: "$4,999", period: "/mo", features: [
|
||||
"Advanced Predictive AI", "Full Ad Automation", "Dedicated Strategist"],
|
||||
button: {
|
||||
text: "Choose Pro", href: "#contact"},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/researcher-using-transparent-digital-tablet-screen-futuristic-technology_53876-101147.jpg?_wi=2", imageAlt: "minimalist tech company logo vector"},
|
||||
{
|
||||
id: "enterprise", title: "Enterprise", price: "$9,999", period: "/mo", features: [
|
||||
"Custom AI Models", "Full White Labeling", "Global Ad Management"],
|
||||
button: {
|
||||
text: "Choose Enterprise", href: "#contact"},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-network-communications-background-with-flowing-floating-particles_1048-12199.jpg?_wi=2", imageAlt: "minimalist tech company logo vector"},
|
||||
]}
|
||||
title="Scalable Plans"
|
||||
description="Transparent pricing for brands ready to leverage AI."
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<AboutMetric
|
||||
title="Our Agency Philosophy"
|
||||
metrics={[
|
||||
{ icon: Monitor, label: "Strategy", value: "Data First" },
|
||||
{ icon: Bot, label: "Execution", value: "AI Powered" },
|
||||
{ icon: Pencil, label: "Design", value: "Pixel Perfect" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSix
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Sarah Jenkins", handle: "@techcorp", testimonial: "Advertise Media's AI transformed our ad spend efficiency instantly.", imageSrc: "http://img.b2bpic.net/free-photo/african-american-engineer-manages-data-from-solar-machinery-desktop-working-solar-panel_482257-132203.jpg"},
|
||||
{
|
||||
id: "2", name: "Michael Rivers", handle: "@creativeco", testimonial: "Unmatched performance results from their predictive engine.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-confident-businessman-wearing-glasses_158595-5356.jpg"},
|
||||
{
|
||||
id: "3", name: "Elena Voss", handle: "@startupxyz", testimonial: "Scaling our brand felt effortless with their automated strategy.", imageSrc: "http://img.b2bpic.net/free-photo/video-editor-worker-standing-front-camera-smiling-working-creative-agency-office-holding-la_482257-3426.jpg"},
|
||||
{
|
||||
id: "4", name: "David Thorne", handle: "@growthagency", testimonial: "Their custom AI models gave us a true competitive advantage.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-adult-businesswoman-with-eyeglasses-office_23-2148452716.jpg"},
|
||||
{
|
||||
id: "5", name: "Maria Lopez", handle: "@luxurybrands", testimonial: "Seamless execution and deep analytical insights.", imageSrc: "http://img.b2bpic.net/free-photo/confident-businesswoman-holding-papers-office_23-2148452636.jpg"},
|
||||
]}
|
||||
title="Success Stories"
|
||||
description="Brands that have accelerated growth with Advertise Media."
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
text="Let's Build Something Extraordinary Together"
|
||||
buttons={[{ text: "Get in touch", href: "mailto:hello@advertisemedia.com" }]}
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "1", title: "How does AI enhance ad performance?", content: "Our AI continuously optimizes your campaigns in real-time, leveraging vast datasets to predict and bid on high-conversion opportunities."},
|
||||
{
|
||||
id: "2", title: "Is my data secure?", content: "Security is our top priority. We employ enterprise-grade encryption for all client data, ensuring absolute confidentiality and compliance."},
|
||||
{
|
||||
id: "3", title: "Can I integrate my existing dashboard?", content: "Yes, Advertise Media fully integrates with major third-party platforms for unified performance management."},
|
||||
]}
|
||||
sideTitle="Common Questions"
|
||||
sideDescription="Get clear answers about our AI-driven marketing solutions."
|
||||
faqsAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="socialProof" data-section="socialProof">
|
||||
<SocialProofOne
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
names={[
|
||||
"Microsoft", "Google", "Amazon", "Apple", "Oracle"]}
|
||||
title="Trusted Partners"
|
||||
description="Collaborating with market leaders globally."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "plain"}}
|
||||
tag="Ready to scale?"
|
||||
title="Start your AI journey with Advertise Media"
|
||||
description="Speak with our team to discover how AI can redefine your ROI."
|
||||
buttons={[
|
||||
{
|
||||
text: "Book a Consultation", href: "#"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Company", items: [
|
||||
{
|
||||
label: "About", href: "#about"},
|
||||
{
|
||||
label: "Careers", href: "#"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Services", items: [
|
||||
{
|
||||
label: "Strategy", href: "#features"},
|
||||
{
|
||||
label: "Analytics", href: "#features"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal", items: [
|
||||
{
|
||||
label: "Privacy", href: "#"},
|
||||
{
|
||||
label: "Terms", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
bottomLeftText="© 2024 Advertise Media. All rights reserved."
|
||||
bottomRightText="Built for innovation."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Advertise Media"
|
||||
leftLink={{ text: "Privacy Policy", href: "#" }}
|
||||
rightLink={{ text: "© 2024 All Rights Reserved", href: "#" }}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -12,13 +12,13 @@
|
||||
|
||||
--background: #0a0a0a;
|
||||
--card: #1a1a1a;
|
||||
--foreground: #f0f8ffe6;
|
||||
--primary-cta: #cee7ff;
|
||||
--foreground: #ffffff;
|
||||
--primary-cta: #106EFB;
|
||||
--primary-cta-text: #0a0a0a;
|
||||
--secondary-cta: #1a1a1a;
|
||||
--secondary-cta: #0a0a0a;
|
||||
--secondary-cta-text: #f0f8ffe6;
|
||||
--accent: #737373;
|
||||
--background-accent: #737373;
|
||||
--accent: #535353;
|
||||
--background-accent: #106EFB;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user