Merge version_2 into main #1
271
src/app/page.tsx
271
src/app/page.tsx
@@ -3,10 +3,10 @@
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import BlogCardOne from '@/components/sections/blog/BlogCardOne';
|
||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||||
import FaqBase from '@/components/sections/faq/FaqBase';
|
||||
import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';
|
||||
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
|
||||
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
@@ -31,76 +31,29 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Features",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "Blog",
|
||||
id: "blog",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Features", id: "features" },
|
||||
{ name: "Blog", id: "blog" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="Cinematique"
|
||||
brandName="Mindloop"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCarouselLogo
|
||||
logoText="CINEMATIQUE"
|
||||
description="Redefining the boundaries of visual storytelling. Immersive experiences powered by innovation."
|
||||
buttons={[
|
||||
{
|
||||
text: "Explore Work",
|
||||
href: "#about",
|
||||
},
|
||||
]}
|
||||
slides={[
|
||||
{
|
||||
videoSrc: "https://res.cloudinary.com/dfonotyfb/video/upload/v1775585556/dds3_1_rqhg7x.mp4",
|
||||
videoAriaLabel: "Cinematic visual background",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/light-streak-lines-background_23-2148133139.jpg",
|
||||
imageAlt: "cinematic abstract tech video",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-blur-empty-green-gradient-studio-well-use-as-backgroundwebsite-templateframebusiness-report_1258-79941.jpg",
|
||||
imageAlt: "Cinematic slide 2",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-heavy-azure-haze-liquid_23-2148102014.jpg",
|
||||
imageAlt: "Cinematic slide 3",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-blue-acrylic-shape-black-background_23-2148469394.jpg",
|
||||
imageAlt: "Cinematic slide 4",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-light-background_23-2148132329.jpg",
|
||||
imageAlt: "Cinematic slide 5",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/green-unique-swirl-trendy-paint-waves-background_23-2148097610.jpg",
|
||||
imageAlt: "Cinematic slide 6",
|
||||
},
|
||||
]}
|
||||
logoText="MINDLOOP"
|
||||
description="Infinite innovation, looped to perfection."
|
||||
buttons={[{ text: "Explore", href: "#about" }]}
|
||||
slides={[{ videoSrc: "https://res.cloudinary.com/dfonotyfb/video/upload/v1775585556/dds3_1_rqhg7x.mp4" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TextSplitAbout
|
||||
useInvertedBackground={true}
|
||||
title="Visionary Craft"
|
||||
description={[
|
||||
"We believe that every frame has a story to tell. Our mission is to capture raw emotion through advanced digital cinema technology.",
|
||||
"Bridging the gap between artistic expression and technical perfection.",
|
||||
]}
|
||||
title="Architecting Thought"
|
||||
description={["We design systems that think. Seamless, dark, monochrome excellence.", "Rooted in innovation, driven by aesthetic precision."]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -110,33 +63,12 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Fluid Motion",
|
||||
descriptions: [
|
||||
"Real-time rendering for cinematic results.",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blue-background-with-lights-abstract_23-2148231529.jpg",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Precision Imaging",
|
||||
descriptions: [
|
||||
"Capture every detail with clarity.",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-hardware-component-background_23-2148882663.jpg",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Adaptive Layers",
|
||||
descriptions: [
|
||||
"Dynamic editing for complex scenes.",
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/artistic-creation-made-from-3d-geometric-shapes_23-2150829161.jpg",
|
||||
},
|
||||
{ id: "f1", title: "Neural Core", descriptions: ["Advanced processing."] },
|
||||
{ id: "f2", title: "Symmetric Design", descriptions: ["Perfect balance."] },
|
||||
{ id: "f3", title: "Infinite Scalability", descriptions: ["Always ready."] },
|
||||
]}
|
||||
title="Advanced Production"
|
||||
description="Cutting-edge tools for next-generation visual creation."
|
||||
title="Design Capabilities"
|
||||
description="Functionality built on a monochrome foundation."
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -146,66 +78,20 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "120+",
|
||||
title: "Films Produced",
|
||||
description: "Diverse visual projects delivered.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/african-american-sound-producer-editing-tracks-audio-software-console_482257-121910.jpg",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "500k",
|
||||
title: "Frames Rendered",
|
||||
description: "Total performance excellence.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-low-poly-background-with-connecting-dots-lines_1048-5910.jpg",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "99.9%",
|
||||
title: "Uptime",
|
||||
description: "Consistent reliability guaranteed.",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/flat-watch-logo-collection_23-2148949708.jpg",
|
||||
},
|
||||
{ id: "m1", value: "100%", title: "Precision", description: "Calculated accuracy.", videoSrc: "https://res.cloudinary.com/dfonotyfb/video/upload/v1775585556/dds3_1_rqhg7x.mp4" },
|
||||
{ id: "m2", value: "24/7", title: "Iteration", description: "Continuous looping.", videoSrc: "https://res.cloudinary.com/dfonotyfb/video/upload/v1775585556/dds3_1_rqhg7x.mp4" },
|
||||
]}
|
||||
title="Impact by Numbers"
|
||||
description="Quantifying our dedication to visual excellence."
|
||||
title="Performance Metrics"
|
||||
description="Driven by data, polished by design."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwelve
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Elena Vance",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-miraculous-mage-halloween_23-2148277460.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Mark Sterling",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/business-man-working-late-office_23-2148991380.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Sarah Croft",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/interior-designer-working-out-office_23-2150379215.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "David Thorne",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/tablet-digital-using-american-bus_1303-2163.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Luna Kim",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/person-indian-origin-having-fun_23-2150285308.jpg",
|
||||
},
|
||||
]}
|
||||
cardTitle="Creative Voices"
|
||||
testimonials={[{ id: "1", name: "Founder A", imageSrc: "" }]}
|
||||
cardTitle="Community"
|
||||
cardAnimation="slide-up"
|
||||
cardTag="Testimonials"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -214,40 +100,8 @@ export default function LandingPage() {
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
title="Insights & Trends"
|
||||
description="Stay updated on the evolving world of digital storytelling."
|
||||
blogs={[
|
||||
{
|
||||
id: "b1",
|
||||
category: "Tech",
|
||||
title: "Future of Cinema",
|
||||
excerpt: "Exploring upcoming trends in AI cinema.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-firing-range-training-with-rifle-wearing-earmuffs-protect-hearing_482257-118591.jpg",
|
||||
authorName: "Jane Doe",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/glasses-smiling-arm-horizontal-front_1262-2739.jpg",
|
||||
date: "Jan 2025",
|
||||
},
|
||||
{
|
||||
id: "b2",
|
||||
category: "Design",
|
||||
title: "Narrative Flows",
|
||||
excerpt: "Crafting compelling stories in limited time.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/person-s-hand-writing-with-pencil-adhesive-note-black-background_23-2147916397.jpg",
|
||||
authorName: "John Smith",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/no-minute-without-my-laptop-handsome-young-man-working-laptop-while-enjoying-coffee-cafe_639032-2899.jpg",
|
||||
date: "Feb 2025",
|
||||
},
|
||||
{
|
||||
id: "b3",
|
||||
category: "Tools",
|
||||
title: "Hardware Essentials",
|
||||
excerpt: "Essential gear for modern filmmakers.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/tape-recorder-near-brick-wall_657883-213.jpg",
|
||||
authorName: "Alex Lee",
|
||||
authorAvatar: "http://img.b2bpic.net/free-photo/traveler-photographer-studio-portrait-handsome-bearded_613910-12325.jpg",
|
||||
date: "Mar 2025",
|
||||
},
|
||||
]}
|
||||
title="Chronicles"
|
||||
description="Latest developments in the Mindloop ecosystem."
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -255,77 +109,30 @@ export default function LandingPage() {
|
||||
<FaqBase
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "How to start?",
|
||||
content: "Reach out via our contact form.",
|
||||
},
|
||||
{
|
||||
id: "q2",
|
||||
title: "What tools used?",
|
||||
content: "Industry-standard suites.",
|
||||
},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Project timelines?",
|
||||
content: "Varies by project scale.",
|
||||
},
|
||||
]}
|
||||
title="Common Inquiries"
|
||||
description="Answers to your questions regarding our services."
|
||||
faqs={[{ id: "q1", title: "Monochrome?", content: "Yes, always." }]}
|
||||
title="Queries"
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
tag="Let's Talk"
|
||||
title="Get Started"
|
||||
description="Ready to build your masterpiece? Sign up for our newsletter or inquiry updates."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/beautiful-shot-yellow-withered-leaves-street_181624-1662.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
<ContactCenter
|
||||
tag="Contact"
|
||||
title="Join the Loop"
|
||||
description="Let's define the next iteration together."
|
||||
background={{ variant: "gradient-bars" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="CINEMATIQUE"
|
||||
columns={[
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Careers",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal",
|
||||
items: [
|
||||
{
|
||||
label: "Privacy",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Terms",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
<FooterMedia
|
||||
logoText="MINDLOOP"
|
||||
columns={[{ title: "Navigate", items: [{ label: "Top", href: "#nav" }] }]}
|
||||
imageSrc=""
|
||||
videoSrc="https://res.cloudinary.com/dfonotyfb/video/upload/v1775585556/dds3_1_rqhg7x.mp4"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -11,14 +11,14 @@
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #000000;
|
||||
--card: #1a2a1a;
|
||||
--card: #0a0a0a;
|
||||
--foreground: #ffffff;
|
||||
--primary-cta: #ffffff;
|
||||
--primary-cta-text: #0a150a;
|
||||
--secondary-cta: #0d1a0d;
|
||||
--secondary-cta: #1a1a1a;
|
||||
--secondary-cta-text: #e1f6e1;
|
||||
--accent: #2d4a2d;
|
||||
--background-accent: #c1e1c1;
|
||||
--accent: #333333;
|
||||
--background-accent: #222222;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user