Merge version_1 into main #2
288
src/app/page.tsx
288
src/app/page.tsx
@@ -33,21 +33,13 @@ export default function LandingPage() {
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "Features",
|
||||
id: "#features",
|
||||
},
|
||||
name: "Features", id: "#features"},
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
name: "About", id: "#about"},
|
||||
{
|
||||
name: "Pricing",
|
||||
id: "#pricing",
|
||||
},
|
||||
name: "Pricing", id: "#pricing"},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
name: "Contact", id: "#contact"},
|
||||
]}
|
||||
brandName="CrimsonFlow"
|
||||
/>
|
||||
@@ -56,76 +48,34 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardDashboard
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
variant: "sparkles-gradient"}}
|
||||
title="Redefine Your Tech Stack"
|
||||
description="Experience peak performance with our crimson-powered infrastructure, designed for developers who demand high-speed processing and robust security."
|
||||
dashboard={{
|
||||
title: "Analytics Engine",
|
||||
stats: [
|
||||
title: "Analytics Engine", stats: [
|
||||
{
|
||||
title: "Latency",
|
||||
values: [
|
||||
12,
|
||||
14,
|
||||
11,
|
||||
],
|
||||
valueSuffix: "ms",
|
||||
description: "Global average",
|
||||
},
|
||||
title: "Latency", values: [12, 14, 11],
|
||||
valueSuffix: "ms", description: "Global average"},
|
||||
{
|
||||
title: "Uptime",
|
||||
values: [
|
||||
99,
|
||||
99,
|
||||
99,
|
||||
],
|
||||
valueSuffix: "%",
|
||||
description: "Annual average",
|
||||
},
|
||||
title: "Uptime", values: [99, 99, 99],
|
||||
valueSuffix: "%", description: "Annual average"},
|
||||
{
|
||||
title: "Throughput",
|
||||
values: [
|
||||
85,
|
||||
92,
|
||||
88,
|
||||
],
|
||||
valueSuffix: "GB/s",
|
||||
description: "Data velocity",
|
||||
},
|
||||
title: "Throughput", values: [85, 92, 88],
|
||||
valueSuffix: "GB/s", description: "Data velocity"},
|
||||
],
|
||||
logoIcon: Zap,
|
||||
sidebarItems: [
|
||||
{
|
||||
icon: LayoutDashboard,
|
||||
active: true,
|
||||
},
|
||||
{
|
||||
icon: Database,
|
||||
},
|
||||
{
|
||||
icon: Shield,
|
||||
},
|
||||
{ icon: LayoutDashboard, active: true },
|
||||
{ icon: Database },
|
||||
{ icon: Shield },
|
||||
],
|
||||
listItems: [
|
||||
{
|
||||
icon: Activity,
|
||||
title: "Node Sync",
|
||||
status: "Active",
|
||||
},
|
||||
{
|
||||
icon: Server,
|
||||
title: "Cache Warm",
|
||||
status: "Ready",
|
||||
},
|
||||
{
|
||||
icon: Terminal,
|
||||
title: "Log Stream",
|
||||
status: "Live",
|
||||
},
|
||||
{ icon: Activity, title: "Node Sync", status: "Active" },
|
||||
{ icon: Server, title: "Cache Warm", status: "Ready" },
|
||||
{ icon: Terminal, title: "Log Stream", status: "Live" },
|
||||
],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/isometric-landing-page_52683-8758.jpg?_wi=1",
|
||||
}}
|
||||
buttons: [],
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/isometric-landing-page_52683-8758.jpg"}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -136,28 +86,13 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Encryption",
|
||||
description: "End-to-end security protocol for all data transfers.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: ShieldCheck,
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/isometric-landing-page_52683-8758.jpg?_wi=2",
|
||||
imageAlt: "dark software interface dashboard glowing red",
|
||||
title: "Encryption", description: "End-to-end security protocol for all data transfers.", bentoComponent: "reveal-icon", icon: ShieldCheck,
|
||||
},
|
||||
{
|
||||
title: "Real-time Metrics",
|
||||
description: "Instant updates on system health and performance.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: BarChart2,
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/data-protection-background_23-2147628986.jpg",
|
||||
imageAlt: "secure data icon red glowing",
|
||||
title: "Real-time Metrics", description: "Instant updates on system health and performance.", bentoComponent: "reveal-icon", icon: BarChart2,
|
||||
},
|
||||
{
|
||||
title: "Global Scaling",
|
||||
description: "Distribute your app across the globe instantly.",
|
||||
bentoComponent: "reveal-icon",
|
||||
icon: Globe,
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/digital-abstract-business-chart-infographics-with-colorful-glossy-web-buttons-icons-isolated_1284-45078.jpg",
|
||||
imageAlt: "digital transformation abstract tech icon",
|
||||
title: "Global Scaling", description: "Distribute your app across the globe instantly.", bentoComponent: "reveal-icon", icon: Globe,
|
||||
},
|
||||
]}
|
||||
title="Built for Velocity"
|
||||
@@ -172,19 +107,13 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Auto-Deploy",
|
||||
description: "Zero-downtime deployment pipeline.",
|
||||
icon: Rocket,
|
||||
title: "Auto-Deploy", description: "Zero-downtime deployment pipeline.", icon: Rocket,
|
||||
},
|
||||
{
|
||||
title: "Cache Logic",
|
||||
description: "Intelligent edge caching mechanics.",
|
||||
icon: Zap,
|
||||
title: "Cache Logic", description: "Intelligent edge caching mechanics.", icon: Zap,
|
||||
},
|
||||
{
|
||||
title: "API Hub",
|
||||
description: "Seamless integration for modern APIs.",
|
||||
icon: Box,
|
||||
title: "API Hub", description: "Seamless integration for modern APIs.", icon: Box,
|
||||
},
|
||||
]}
|
||||
title="Advanced Engine Features"
|
||||
@@ -198,18 +127,9 @@ export default function LandingPage() {
|
||||
title="The Crimson Vision"
|
||||
description="We are revolutionizing how teams interact with their data, bringing speed and visual clarity to the core of your software."
|
||||
metrics={[
|
||||
{
|
||||
value: "1.2M",
|
||||
title: "Tasks Processed",
|
||||
},
|
||||
{
|
||||
value: "500+",
|
||||
title: "Active Integrations",
|
||||
},
|
||||
{
|
||||
value: "99.9%",
|
||||
title: "Reliability",
|
||||
},
|
||||
{ value: "1.2M", title: "Tasks Processed" },
|
||||
{ value: "500+", title: "Active Integrations" },
|
||||
{ value: "99.9%", title: "Reliability" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/notorious-trader-constructing-dynasty-via-shifts-markets_482257-88025.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
@@ -224,40 +144,15 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Sarah Chen",
|
||||
handle: "@sarah_dev",
|
||||
testimonial: "The performance boost was instant. The red dashboard aesthetic is amazing.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-portrait-with-bright-blue-lips_23-2151096441.jpg?_wi=1",
|
||||
},
|
||||
id: "1", name: "Sarah Chen", handle: "@sarah_dev", testimonial: "The performance boost was instant. The red dashboard aesthetic is amazing.", imageSrc: "http://img.b2bpic.net/free-photo/woman-portrait-with-bright-blue-lips_23-2151096441.jpg"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Marcus Thorne",
|
||||
handle: "@mthorne",
|
||||
testimonial: "Finally, a platform that understands what developers actually need.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/smiling-business-woman-looking-up-copy-space_1262-3088.jpg",
|
||||
},
|
||||
id: "2", name: "Marcus Thorne", handle: "@mthorne", testimonial: "Finally, a platform that understands what developers actually need.", imageSrc: "http://img.b2bpic.net/free-photo/smiling-business-woman-looking-up-copy-space_1262-3088.jpg"},
|
||||
{
|
||||
id: "3",
|
||||
name: "Elena Rodriguez",
|
||||
handle: "@elena_dev",
|
||||
testimonial: "Incredible infrastructure, we haven't seen a moment of downtime since launch.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/profile-portrait-serious-man-looking-out-window_1262-1879.jpg",
|
||||
},
|
||||
id: "3", name: "Elena Rodriguez", handle: "@elena_dev", testimonial: "Incredible infrastructure, we haven't seen a moment of downtime since launch.", imageSrc: "http://img.b2bpic.net/free-photo/profile-portrait-serious-man-looking-out-window_1262-1879.jpg"},
|
||||
{
|
||||
id: "4",
|
||||
name: "David Kim",
|
||||
handle: "@davidk",
|
||||
testimonial: "CrimsonFlow is the backbone of our entire tech stack.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pensive-middle-aged-man-with-beard-hairstyle-dressed-elegant-blue-suit-textured-dark-background-studio_613910-19863.jpg",
|
||||
},
|
||||
id: "4", name: "David Kim", handle: "@davidk", testimonial: "CrimsonFlow is the backbone of our entire tech stack.", imageSrc: "http://img.b2bpic.net/free-photo/pensive-middle-aged-man-with-beard-hairstyle-dressed-elegant-blue-suit-textured-dark-background-studio_613910-19863.jpg"},
|
||||
{
|
||||
id: "5",
|
||||
name: "Jamie Lee",
|
||||
handle: "@jlee_arch",
|
||||
testimonial: "The most reliable infrastructure I have ever worked with, period.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-portrait-with-bright-blue-lips_23-2151096441.jpg?_wi=2",
|
||||
},
|
||||
id: "5", name: "Jamie Lee", handle: "@jlee_arch", testimonial: "The most reliable infrastructure I have ever worked with, period.", imageSrc: "http://img.b2bpic.net/free-photo/woman-portrait-with-bright-blue-lips_23-2151096441.jpg"},
|
||||
]}
|
||||
title="Loved by Developers"
|
||||
description="See why top teams trust our engine."
|
||||
@@ -271,53 +166,16 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "starter",
|
||||
name: "Starter",
|
||||
price: "$99",
|
||||
features: [
|
||||
"10M Requests",
|
||||
"Basic Support",
|
||||
"Daily Backups",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Get Started",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
id: "starter", name: "Starter", price: "$99", features: ["10M Requests", "Basic Support", "Daily Backups"],
|
||||
buttons: [{ text: "Get Started", href: "#" }],
|
||||
},
|
||||
{
|
||||
id: "pro",
|
||||
name: "Professional",
|
||||
price: "$299",
|
||||
features: [
|
||||
"100M Requests",
|
||||
"Priority Support",
|
||||
"Real-time Metrics",
|
||||
],
|
||||
badge: "Popular",
|
||||
buttons: [
|
||||
{
|
||||
text: "Get Started",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
id: "pro", name: "Professional", price: "$299", features: ["100M Requests", "Priority Support", "Real-time Metrics"],
|
||||
badge: "Popular", buttons: [{ text: "Get Started", href: "#" }],
|
||||
},
|
||||
{
|
||||
id: "enterprise",
|
||||
name: "Enterprise",
|
||||
price: "Custom",
|
||||
features: [
|
||||
"Unlimited Requests",
|
||||
"24/7 Dedicated Support",
|
||||
"SLA Guarantee",
|
||||
],
|
||||
buttons: [
|
||||
{
|
||||
text: "Contact Us",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
id: "enterprise", name: "Enterprise", price: "Custom", features: ["Unlimited Requests", "24/7 Dedicated Support", "SLA Guarantee"],
|
||||
buttons: [{ text: "Contact Us", href: "#" }],
|
||||
},
|
||||
]}
|
||||
title="Flexible Scaling"
|
||||
@@ -331,20 +189,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "How do I migrate?",
|
||||
content: "Our migration tools provide automated guidance from your existing stack.",
|
||||
},
|
||||
id: "1", title: "How do I migrate?", content: "Our migration tools provide automated guidance from your existing stack."},
|
||||
{
|
||||
id: "2",
|
||||
title: "Is security guaranteed?",
|
||||
content: "We offer multi-layered encryption as part of our core architecture.",
|
||||
},
|
||||
id: "2", title: "Is security guaranteed?", content: "We offer multi-layered encryption as part of our core architecture."},
|
||||
{
|
||||
id: "3",
|
||||
title: "Can I upgrade anytime?",
|
||||
content: "Yes, scaling up your subscription levels can be done instantly.",
|
||||
},
|
||||
id: "3", title: "Can I upgrade anytime?", content: "Yes, scaling up your subscription levels can be done instantly."},
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Answers to the most common queries about the CrimsonFlow infrastructure."
|
||||
@@ -356,17 +205,11 @@ export default function LandingPage() {
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
variant: "sparkles-gradient"}}
|
||||
tag="Get Started"
|
||||
title="Ready to build?"
|
||||
description="Join the crimson revolution and scale your applications faster than ever."
|
||||
buttons={[
|
||||
{
|
||||
text: "Talk to Sales",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "Talk to Sales", href: "#" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -375,42 +218,21 @@ export default function LandingPage() {
|
||||
logoText="CrimsonFlow"
|
||||
columns={[
|
||||
{
|
||||
title: "Product",
|
||||
items: [
|
||||
{
|
||||
label: "Features",
|
||||
href: "#features",
|
||||
},
|
||||
{
|
||||
label: "Pricing",
|
||||
href: "#pricing",
|
||||
},
|
||||
title: "Product", items: [
|
||||
{ label: "Features", href: "#features" },
|
||||
{ label: "Pricing", href: "#pricing" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{
|
||||
label: "Docs",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "API",
|
||||
href: "#",
|
||||
},
|
||||
title: "Support", items: [
|
||||
{ label: "Docs", href: "#" },
|
||||
{ label: "API", href: "#" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Careers",
|
||||
href: "#",
|
||||
},
|
||||
title: "Company", items: [
|
||||
{ label: "About", href: "#about" },
|
||||
{ label: "Careers", href: "#" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
@@ -420,4 +242,4 @@ export default function LandingPage() {
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user