Merge version_5 into main #9
202
src/app/page.tsx
202
src/app/page.tsx
@@ -2,9 +2,9 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||||
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
|
||||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||||
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
||||
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
|
||||
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
|
||||
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
|
||||
@@ -32,18 +32,13 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Features", id: "features"},
|
||||
{
|
||||
name: "Showcase", id: "showcase"},
|
||||
{
|
||||
name: "Testimonials", id: "testimonials"},
|
||||
{
|
||||
name: "Pricing", id: "pricing"},
|
||||
{ name: "Features", id: "features" },
|
||||
{ name: "Showcase", id: "showcase" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Pricing", id: "pricing" },
|
||||
]}
|
||||
brandName="LUX"
|
||||
button={{
|
||||
text: "Get Started", href: "#contact"}}
|
||||
button={{ text: "Get Started", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -54,27 +49,11 @@ export default function LandingPage() {
|
||||
tag="Elevate Your Brand"
|
||||
tagAnimation="slide-up"
|
||||
buttons={[
|
||||
{
|
||||
text: "Explore Services", href: "#features"},
|
||||
{
|
||||
text: "Contact Us", href: "#contact"},
|
||||
{ text: "Explore Services", href: "#features" },
|
||||
{ text: "Contact Us", href: "#contact" },
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/greyscale-shot-beautiful-brutalist-architectural-structure_181624-5104.jpg"
|
||||
imageAlt="minimalist abstract geometric background"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/thoughtful-businesswoman-looking-through-window_1262-2043.jpg", alt: "Thoughtful Businesswoman Looking Through Window"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/expressive-senior-female-posing-indoor_344912-1352.jpg", alt: "Expressive senior female posing indoor"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-woman-standing-inside-office-center_1303-22415.jpg", alt: "Young woman standing inside the office center"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-fashionable-well-dressed-man-with-beard-posing-outdoors_1328-3267.jpg", alt: "Portrait of fashionable well dressed man with beard posing outdoors"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/closeup-content-pretty-businesswoman-glasses_1262-1740.jpg", alt: "Closeup of Content Pretty Businesswoman in Glasses"},
|
||||
]}
|
||||
avatarText="Trusted by 500+ leaders"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -82,12 +61,9 @@ export default function LandingPage() {
|
||||
<InlineImageSplitTextAbout
|
||||
useInvertedBackground={false}
|
||||
heading={[
|
||||
{
|
||||
type: "text", content: "Precision-crafted digital solutions for "},
|
||||
{
|
||||
type: "image", src: "http://img.b2bpic.net/free-photo/elevated-view-diary-digital-tablet-pen-keyboard-coffee-cup-desk_23-2148061557.jpg", alt: "modern minimalist startup office"},
|
||||
{
|
||||
type: "text", content: " those who lead."},
|
||||
{ type: "text", content: "Precision-crafted digital solutions for " },
|
||||
{ type: "image", src: "http://img.b2bpic.net/free-photo/elevated-view-diary-digital-tablet-pen-keyboard-coffee-cup-desk_23-2148061557.jpg" },
|
||||
{ type: "text", content: " those who lead." },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -97,33 +73,9 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Seamless Integration", description: "Connect your ecosystem with unparalleled speed.", icon: Zap,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-smartphone-mockup-with-blank-screen-gray-background_9975-133666.jpg", imageAlt: "modern ui design interface"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/y2k-website-window-illustration_23-2151874940.jpg", imageAlt: "modern ui design interface"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Intelligent Data", description: "Actionable insights delivered in real-time.", icon: BarChart2,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-render-modern-with-flowing-abstract-particle-design_1048-13801.jpg", imageAlt: "abstract data visualization nodes"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-abstract-black-white-background_23-2150913805.jpg", imageAlt: "abstract data visualization nodes"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Product Excellence", description: "Beautifully crafted hardware that speaks for itself.", icon: Database,
|
||||
mediaItems: [
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-body-butter-recipient_23-2148543013.jpg?_wi=1", imageAlt: "minimalist mobile mockup mockup"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/product-backdrop-cinematic-smoke-realistic-design_53876-146678.jpg", imageAlt: "minimalist mobile mockup mockup"},
|
||||
],
|
||||
},
|
||||
{ title: "Seamless Integration", description: "Connect your ecosystem with unparalleled speed.", icon: Zap, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/modern-smartphone-mockup-with-blank-screen-gray-background_9975-133666.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/y2k-website-window-illustration_23-2151874940.jpg" }] },
|
||||
{ title: "Intelligent Data", description: "Actionable insights delivered in real-time.", icon: BarChart2, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/3d-render-modern-with-flowing-abstract-particle-design_1048-13801.jpg" }, { imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-abstract-black-white-background_23-2150913805.jpg" }] },
|
||||
{ title: "Product Excellence", description: "Beautifully crafted hardware that speaks for itself.", icon: Database, mediaItems: [{ imageSrc: "http://img.b2bpic.net/free-photo/close-up-body-butter-recipient_23-2148543013.jpg?_wi=1" }, { imageSrc: "http://img.b2bpic.net/free-photo/product-backdrop-cinematic-smoke-realistic-design_53876-146678.jpg" }] },
|
||||
]}
|
||||
title="Engineered for Performance"
|
||||
description="Experience superior technology designed to scale with your ambition."
|
||||
@@ -138,18 +90,9 @@ export default function LandingPage() {
|
||||
gridVariant="asymmetric-60-wide-40-narrow"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1", name: "Nova Hub", price: "$999", variant: "Premium", imageSrc: "http://img.b2bpic.net/free-photo/close-up-body-butter-recipient_23-2148543013.jpg?_wi=2"},
|
||||
{
|
||||
id: "p2", name: "Eon Pad", price: "$499", variant: "Standard", imageSrc: "http://img.b2bpic.net/free-photo/soap-twig-near-cups_23-2147809272.jpg"},
|
||||
{
|
||||
id: "p3", name: "Titan Link", price: "$149", variant: "Pro", imageSrc: "http://img.b2bpic.net/free-photo/wireless-earbuds-with-neon-cyberpunk-style-lighting_23-2151074259.jpg"},
|
||||
{
|
||||
id: "p4", name: "Flux Sensor", price: "$89", variant: "Basic", imageSrc: "http://img.b2bpic.net/free-photo/closeup-peeler_116348-9.jpg"},
|
||||
{
|
||||
id: "p5", name: "Zen Audio", price: "$299", variant: "Elite", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-hard-drive-with-red-light-still-life_23-2149417035.jpg"},
|
||||
{
|
||||
id: "p6", name: "Pulse Node", price: "$59", variant: "Starter", imageSrc: "http://img.b2bpic.net/free-photo/office-desktop-with-laptop_23-2148166715.jpg"},
|
||||
{ id: "p1", name: "Nova Hub", price: "$999", variant: "Premium", imageSrc: "http://img.b2bpic.net/free-photo/close-up-body-butter-recipient_23-2148543013.jpg?_wi=2" },
|
||||
{ id: "p2", name: "Eon Pad", price: "$499", variant: "Standard", imageSrc: "http://img.b2bpic.net/free-photo/soap-twig-near-cups_23-2147809272.jpg" },
|
||||
{ id: "p3", name: "Titan Link", price: "$149", variant: "Pro", imageSrc: "http://img.b2bpic.net/free-photo/wireless-earbuds-with-neon-cyberpunk-style-lighting_23-2151074259.jpg" },
|
||||
]}
|
||||
title="Selected Works"
|
||||
description="Browse our collection of innovative products."
|
||||
@@ -161,18 +104,8 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", title: "Game Changer", quote: "The most sophisticated digital experience I have ever encountered.", name: "Sarah Johnson", role: "CEO", imageSrc: "http://img.b2bpic.net/free-photo/confident-man-leaning-wall_23-2148401390.jpg"},
|
||||
{
|
||||
id: "2", title: "Seamless", quote: "Effortless performance, incredible aesthetics. Truly top tier.", name: "Michael Chen", role: "CTO", imageSrc: "http://img.b2bpic.net/free-photo/handsome-muscular-young-man-posing_158595-3045.jpg"},
|
||||
{
|
||||
id: "3", title: "Exceptional", quote: "LUX changed the way we perceive software products.", name: "Emily Rodriguez", role: "Design Lead", imageSrc: "http://img.b2bpic.net/free-photo/happy-bearded-man-brown-suit-wearing-glasses-looking-smiling-cheerfully_141793-111775.jpg"},
|
||||
{
|
||||
id: "4", title: "Inspiring", quote: "Finally, a brand that prioritizes quality above everything else.", name: "David Kim", role: "Product Mgr", imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-successful-businessman-standing-restaurant-with-crossed-arm_23-2147955259.jpg"},
|
||||
{
|
||||
id: "5", title: "World Class", quote: "Absolutely perfect from start to finish.", name: "Anna Smith", role: "VP Tech", imageSrc: "http://img.b2bpic.net/free-photo/portrait-men-sitting-chair-with-white-t-shirt-sunglasses-street_1153-6668.jpg"},
|
||||
{
|
||||
id: "6", title: "Innovative", quote: "The attention to detail is just insane.", name: "Mark Wilson", role: "Developer", imageSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-woman-posing-fashionable-outfit_23-2149021799.jpg"},
|
||||
{ id: "1", title: "Game Changer", quote: "The most sophisticated digital experience I have ever encountered.", name: "Sarah Johnson", role: "CEO", imageSrc: "http://img.b2bpic.net/free-photo/confident-man-leaning-wall_23-2148401390.jpg" },
|
||||
{ id: "2", title: "Seamless", quote: "Effortless performance, incredible aesthetics. Truly top tier.", name: "Michael Chen", role: "CTO", imageSrc: "http://img.b2bpic.net/free-photo/handsome-muscular-young-man-posing_158595-3045.jpg" },
|
||||
]}
|
||||
title="Voice of Leaders"
|
||||
description="What our partners have to say about the LUX experience."
|
||||
@@ -185,30 +118,8 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "basic", badge: "Essentials", price: "$49", subtitle: "Perfect for individuals", buttons: [
|
||||
{
|
||||
text: "Select", href: "#"},
|
||||
],
|
||||
features: [
|
||||
"Feature A", "Feature B", "Support"],
|
||||
},
|
||||
{
|
||||
id: "pro", badge: "Advanced", price: "$199", subtitle: "For growing startups", buttons: [
|
||||
{
|
||||
text: "Select", href: "#"},
|
||||
],
|
||||
features: [
|
||||
"All Essentials", "Analytics", "Priority Access"],
|
||||
},
|
||||
{
|
||||
id: "enterprise", badge: "Elite", price: "Custom", subtitle: "Unbounded potential", buttons: [
|
||||
{
|
||||
text: "Contact", href: "#contact"},
|
||||
],
|
||||
features: [
|
||||
"Global Support", "Custom API", "Unlimited Scaling"],
|
||||
},
|
||||
{ id: "basic", badge: "Essentials", price: "$49", subtitle: "Perfect for individuals", buttons: [{ text: "Select", href: "#" }], features: ["Feature A", "Feature B", "Support"] },
|
||||
{ id: "pro", badge: "Advanced", price: "$199", subtitle: "For growing startups", buttons: [{ text: "Select", href: "#" }], features: ["All Essentials", "Analytics", "Priority Access"] },
|
||||
]}
|
||||
title="Select Your Tier"
|
||||
description="Scalable options for growing teams."
|
||||
@@ -221,63 +132,38 @@ export default function LandingPage() {
|
||||
title="Performance at Scale"
|
||||
tag="Our Impact"
|
||||
metrics={[
|
||||
{
|
||||
id: "m1", value: "100+", description: "Global Deployments"},
|
||||
{
|
||||
id: "m2", value: "24/7", description: "Customer Success"},
|
||||
{
|
||||
id: "m3", value: "99.9%", description: "Uptime Guarantee"},
|
||||
{ id: "m1", value: "100+", description: "Global Deployments" },
|
||||
{ id: "m2", value: "24/7", description: "Customer Success" },
|
||||
{ id: "m3", value: "99.9%", description: "Uptime Guarantee" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "animated-grid"}}
|
||||
tag="Let's Talk"
|
||||
title="Ready to get started?"
|
||||
description="Join the elite cohort of companies redefining the future of digital experiences."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/business-network-background-connecting-dots-technology-design_53876-153344.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
<ContactSplitForm
|
||||
title="Ready to get started?"
|
||||
description="Join the elite cohort of companies redefining the future of digital experiences."
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Full Name", required: true },
|
||||
{ name: "email", type: "email", placeholder: "Email Address", required: true }
|
||||
]}
|
||||
textarea={{ name: "message", placeholder: "How can we help?", rows: 4 }}
|
||||
mediaPosition="right"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Platform", items: [
|
||||
{
|
||||
label: "Features", href: "#features"},
|
||||
{
|
||||
label: "Showcase", href: "#showcase"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{
|
||||
label: "About", href: "#"},
|
||||
{
|
||||
label: "Contact", href: "#contact"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal", items: [
|
||||
{
|
||||
label: "Privacy", href: "#"},
|
||||
{
|
||||
label: "Terms", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
bottomLeftText="© 2024 LUX Technologies."
|
||||
bottomRightText="All rights reserved."
|
||||
/>
|
||||
<FooterBaseCard
|
||||
logoText="LUX"
|
||||
columns={[
|
||||
{ title: "Company", items: [{ label: "Features", href: "#features" }, { label: "Showcase", href: "#showcase" }] },
|
||||
{ title: "Resources", items: [{ label: "Privacy", href: "#" }, { label: "Terms", href: "#" }] }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -10,15 +10,15 @@
|
||||
--accent: #ffffff;
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #0a0a0a;
|
||||
--card: #1a1a1a;
|
||||
--background: #000000;
|
||||
--card: #0a0a0a;
|
||||
--foreground: #f5f5f5;
|
||||
--primary-cta: #dfff1c;
|
||||
--primary-cta: #007AFF;
|
||||
--primary-cta-text: #0a0a0a;
|
||||
--secondary-cta: #1a1a1a;
|
||||
--secondary-cta-text: #ffffff;
|
||||
--accent: #8b9a1b;
|
||||
--background-accent: #5d6b00;
|
||||
--accent: #007AFF;
|
||||
--background-accent: #0a0a0a;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user