Compare commits
1 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 45c2c25fc7 |
155
src/app/page.tsx
155
src/app/page.tsx
@@ -1,141 +1,54 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
|
import React, { useRef, useEffect } from "react";
|
||||||
import ReactLenis from "lenis/react";
|
import ReactLenis from "lenis/react";
|
||||||
import HeroCarouselLogo from "@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo";
|
import { motion, useScroll, useTransform, useSpring } from "framer-motion";
|
||||||
import InlineImageSplitTextAbout from "@/components/sections/about/InlineImageSplitTextAbout";
|
|
||||||
import FeatureCardOne from "@/components/sections/feature/FeatureCardOne";
|
|
||||||
import FeatureCardNine from "@/components/sections/feature/FeatureCardNine";
|
|
||||||
import FeatureCardMedia from "@/components/sections/feature/FeatureCardMedia";
|
|
||||||
import TestimonialCardFive from "@/components/sections/testimonial/TestimonialCardFive";
|
|
||||||
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
|
|
||||||
import FooterCard from "@/components/sections/footer/FooterCard";
|
|
||||||
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
import { Sparkles, Megaphone, Target, Instagram, Linkedin, Twitter } from "lucide-react";
|
|
||||||
|
|
||||||
export default function DOOHBusinessPage() {
|
export default function CinematicSpacePage() {
|
||||||
return (
|
return (
|
||||||
<ThemeProvider
|
<ThemeProvider
|
||||||
defaultButtonVariant="icon-arrow"
|
defaultButtonVariant="elastic-effect"
|
||||||
defaultTextAnimation="entrance-slide"
|
defaultTextAnimation="reveal-blur"
|
||||||
borderRadius="rounded"
|
borderRadius="pill"
|
||||||
contentWidth="medium"
|
contentWidth="medium"
|
||||||
sizing="medium"
|
sizing="medium"
|
||||||
background="none"
|
background="none"
|
||||||
cardStyle="solid"
|
cardStyle="glass-depth"
|
||||||
primaryButtonStyle="shadow"
|
primaryButtonStyle="primary-glow"
|
||||||
secondaryButtonStyle="solid"
|
secondaryButtonStyle="glass"
|
||||||
headingFontWeight="medium"
|
headingFontWeight="extrabold"
|
||||||
>
|
>
|
||||||
<ReactLenis root>
|
<ReactLenis root>
|
||||||
<NavbarLayoutFloatingInline
|
<NavbarLayoutFloatingInline
|
||||||
navItems={[
|
navItems={[
|
||||||
{ name: "About", id: "about" },
|
{ name: "Hero", id: "hero" },
|
||||||
{ name: "Solutions", id: "services" },
|
{ name: "Capabilities", id: "capabilities" },
|
||||||
{ name: "Network", id: "destinations" },
|
|
||||||
{ name: "Success", id: "reviews" },
|
|
||||||
{ name: "Contact", id: "contact" },
|
|
||||||
]}
|
|
||||||
brandName="VividStream"
|
|
||||||
button={{ text: "Get a Quote", href: "#contact" }}
|
|
||||||
/>
|
|
||||||
<HeroCarouselLogo
|
|
||||||
logoText="VividStream"
|
|
||||||
description="Elevate your brand with high-impact digital out-of-home advertising. We connect brands with audiences through premium screen networks."
|
|
||||||
buttons={[
|
|
||||||
{ text: "View Our Network", href: "#destinations" },
|
|
||||||
{ text: "Book a Campaign", href: "#contact" },
|
|
||||||
]}
|
|
||||||
slides={[
|
|
||||||
{ imageSrc: "http://img.b2bpic.net/free-photo/hong-kong-traffic-view_1359-1097.jpg", imageAlt: "Digital billboard in cityscape" },
|
|
||||||
{ imageSrc: "http://img.b2bpic.net/free-photo/young-asian-businessman-wireless-earphones-thoughtfully-watching-timetable-public-transport-metro-station-outdoor_574295-1809.jpg", imageAlt: "Modern transit advertising" },
|
|
||||||
{ imageSrc: "http://img.b2bpic.net/free-photo/nighttime-downtown-city-avenues_482257-76489.jpg", imageAlt: "Smart city signage" },
|
|
||||||
]}
|
|
||||||
showDimOverlay={true}
|
|
||||||
/>
|
|
||||||
<InlineImageSplitTextAbout
|
|
||||||
className="pt-40"
|
|
||||||
heading={[
|
|
||||||
{ type: "text", content: "Capturing attention at" },
|
|
||||||
{ type: "image", src: "http://img.b2bpic.net/free-photo/young-people-using-sustainable-mobility_23-2149290912.jpg", alt: "Busy city street" },
|
|
||||||
{ type: "text", content: "every touchpoint. We build" },
|
|
||||||
{ type: "image", src: "http://img.b2bpic.net/free-photo/japanese-subway-train-system-passenger-information-display-screen_23-2148954832.jpg", alt: "Premium digital screen" },
|
|
||||||
{ type: "text", content: "dynamic audience engagement." },
|
|
||||||
]}
|
|
||||||
buttons={[
|
|
||||||
{ text: "Our Philosophy", href: "#" },
|
|
||||||
]}
|
|
||||||
useInvertedBackground={false}
|
|
||||||
/>
|
|
||||||
<FeatureCardOne
|
|
||||||
tag="Our Solutions"
|
|
||||||
tagIcon={Sparkles}
|
|
||||||
title="Advertising That Works"
|
|
||||||
description="Data-driven deployment, creative excellence, and unmatched visibility in high-traffic urban environments."
|
|
||||||
textboxLayout="default"
|
|
||||||
animationType="slide-up"
|
|
||||||
gridVariant="uniform-all-items-equal"
|
|
||||||
useInvertedBackground={false}
|
|
||||||
features={[
|
|
||||||
{ title: "Transit Hubs", description: "High-frequency screens at airports and subway stations.", imageSrc: "http://img.b2bpic.net/free-photo/subway-station_1112-1830.jpg", imageAlt: "Transit hub" },
|
|
||||||
{ title: "Retail Malls", description: "Captivating displays inside premier shopping centers.", imageSrc: "http://img.b2bpic.net/free-photo/asian-women-looking-something-phone_23-2149122959.jpg", imageAlt: "Retail mall" },
|
|
||||||
{ title: "Urban Core", description: "Iconic large-format digital billboards in city centers.", imageSrc: "http://img.b2bpic.net/free-photo/census-information-town-composition_23-2148993122.jpg", imageAlt: "City center" },
|
|
||||||
{ title: "Smart Analytics", description: "Real-time insights on audience reach and engagement.", imageSrc: "http://img.b2bpic.net/free-photo/people-working-laptop-meeting_53876-64855.jpg", imageAlt: "Dashboard" },
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
<FeatureCardNine
|
|
||||||
tag="How It Works"
|
|
||||||
tagIcon={Target}
|
|
||||||
title="Campaign Success Workflow"
|
|
||||||
description="Simple, efficient, and results-focused implementation for your brand."
|
|
||||||
textboxLayout="default"
|
|
||||||
showStepNumbers={true}
|
|
||||||
animationType="slide-up"
|
|
||||||
features={[
|
|
||||||
{ title: "Strategic Planning", description: "We identify the optimal placements based on your target demographic.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/young-team-coworkers-working-project_273609-16267.jpg" }, phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/bearded-man-answers-questions-meeting_482257-115047.jpg" } },
|
|
||||||
{ title: "Creative Production", description: "Dynamic content tailored for maximum impact on digital displays.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/interior-designer-working-out-office_23-2150379225.jpg" }, phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-videographer-splicing-film-pieces-using-mockup-computer_482257-118874.jpg" } },
|
|
||||||
{ title: "Performance Tracking", description: "Analyze real-time reach data and optimize campaign delivery.", phoneOne: { imageSrc: "http://img.b2bpic.net/free-photo/2020-economy-chart_23-2148541992.jpg" }, phoneTwo: { imageSrc: "http://img.b2bpic.net/free-photo/african-american-consultant-studying-constitutional-records_482257-102830.jpg" } },
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
<FeatureCardMedia
|
|
||||||
tag="Our Network"
|
|
||||||
tagIcon={Megaphone}
|
|
||||||
title="Premium Display Inventory"
|
|
||||||
description="A curated list of our most impactful advertising screens."
|
|
||||||
animationType="slide-up"
|
|
||||||
features={[
|
|
||||||
{ id: "1", title: "Times Square North", description: "Premium prime-time visibility.", tag: "Billboard", imageSrc: "http://img.b2bpic.net/free-photo/blurred-vehicle-passing-by-blank-billboard-road_23-2147922102.jpg" },
|
|
||||||
{ id: "2", title: "Central Station", description: "High foot traffic area.", tag: "Indoor", imageSrc: "http://img.b2bpic.net/free-photo/billboard-airport_1137-212.jpg" },
|
|
||||||
{ id: "3", title: "West Side Mall", description: "Engaging retail audience.", tag: "Digital", imageSrc: "http://img.b2bpic.net/free-photo/customer-interacting-with-digital-smart-board-clothing-retail-store-african-american-man-tapping-whiteboard-blank-screen-read-information-about-shoes-new-collection-shopping-mall_482257-63271.jpg" },
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
<TestimonialCardFive
|
|
||||||
tag="Client Success"
|
|
||||||
title="What Partners Say"
|
|
||||||
description="Stories from brands that grew with VividStream."
|
|
||||||
textboxLayout="default"
|
|
||||||
testimonials={[
|
|
||||||
{ id: "1", name: "Sarah Jenkins", date: "Oct 2024", title: "Unparalleled reach", quote: "The analytics provided during our campaign were game-changing.", tag: "Tech", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-shot-successful-beautiful-confident-senior-businesswoman-her-fifties-with-gray-hair-blue-wise-eyes-posing-indoors-keeping-arms-folded-looking-with-charming-smile_344912-1851.jpg", imageSrc: "http://img.b2bpic.net/free-photo/businessman-presenting-something-digital-tablet_329181-560.jpg" },
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
<ContactSplitForm
|
|
||||||
title="Ready to Amplify?"
|
|
||||||
description="Get in touch for a custom media plan."
|
|
||||||
imageSrc="http://img.b2bpic.net/free-photo/modern-office-space-with-futuristic-decor-furniture_23-2151797638.jpg"
|
|
||||||
inputs={[
|
|
||||||
{ name: "name", type: "text", placeholder: "Full Name", required: true },
|
|
||||||
{ name: "company", type: "text", placeholder: "Company Name", required: true },
|
|
||||||
]}
|
|
||||||
textarea={{ name: "message", placeholder: "Tell us about your campaign goals..." }}
|
|
||||||
/>
|
|
||||||
<FooterCard
|
|
||||||
logoText="VividStream"
|
|
||||||
copyrightText="© 2025 VividStream Media Group"
|
|
||||||
socialLinks={[
|
|
||||||
{ icon: Instagram, href: "#", ariaLabel: "Instagram" },
|
|
||||||
{ icon: Linkedin, href: "#", ariaLabel: "LinkedIn" },
|
|
||||||
]}
|
]}
|
||||||
|
brandName="VOID"
|
||||||
|
button={{ text: "Launch", href: "#capabilities" }}
|
||||||
/>
|
/>
|
||||||
|
<section id="hero" className="relative h-screen w-full overflow-hidden">
|
||||||
|
<motion.div className="absolute inset-0 z-0 flex flex-col items-center justify-center p-8 text-center">
|
||||||
|
<motion.h1
|
||||||
|
initial={{ opacity: 0, y: 50 }}
|
||||||
|
whileInView={{ opacity: 1, y: 0 }}
|
||||||
|
className="text-8xl font-black tracking-tighter text-white"
|
||||||
|
>
|
||||||
|
BEYOND THE HORIZON
|
||||||
|
</motion.h1>
|
||||||
|
<p className="mt-6 max-w-xl text-lg text-white/70">
|
||||||
|
Experience the silent majesty of deep-space travel with our liquid-glass kinetic interface.
|
||||||
|
</p>
|
||||||
|
</motion.div>
|
||||||
|
</section>
|
||||||
|
<section id="capabilities" className="relative h-screen w-full flex items-center justify-center bg-black/5">
|
||||||
|
<div className="max-w-4xl p-12 glass-depth rounded-3xl">
|
||||||
|
<h2 className="text-5xl font-bold">Navigation Dynamics</h2>
|
||||||
|
<p className="mt-6 text-xl">Precision-engineered spatial awareness modules designed for interstellar endurance.</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
</ReactLenis>
|
</ReactLenis>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user