Refactored landing page

This commit is contained in:
2026-02-13 21:38:32 +01:00
parent 3a045ccd0a
commit 1fbd48b47d
+93 -103
View File
@@ -1,6 +1,16 @@
"use client"; "use client";
import Link from "next/link"; import Link from "next/link";
import { Motion, Staggered } from "tailwind-motlib"; import { Motion, Staggered } from "tailwind-motlib";
import {
Shield,
Zap,
Brain,
Scan,
BarChart3,
Filter,
Send,
TrendingDown,
} from "lucide-react";
export default function Landing() { export default function Landing() {
return ( return (
@@ -27,12 +37,13 @@ export default function Landing() {
</p> </p>
<div className="mt-10 flex gap-4"> <div className="mt-10 flex gap-4">
<Link href="/markets"> <Link href="/markets" className="animate-fade-in-up">
<button className="px-6 py-3 rounded-lg bg-primary text-primary-foreground font-medium hover:opacity-90 transition"> <button className="px-6 py-3 rounded-lg bg-primary text-primary-foreground font-medium hover:opacity-90 transition">
Open Terminal Open Terminal
</button> </button>
</Link> </Link>
<Link <Link
className="animate-fade-in-up animate-delay-100"
href="https://github.com/nexa-sol/nexa-trade?tab=readme-ov-file#-nexa-roadmap--alpha-release" href="https://github.com/nexa-sol/nexa-trade?tab=readme-ov-file#-nexa-roadmap--alpha-release"
target="_blank" target="_blank"
> >
@@ -44,118 +55,97 @@ export default function Landing() {
</div> </div>
</section> </section>
{/* Live signal strip */} {/* Features */}
{/* <section className="relative z-10 border-y border-border/60 bg-card/40 backdrop-blur">
<div className="max-w-7xl mx-auto px-6 py-4 flex gap-8 text-sm text-muted-foreground overflow-x-auto">
<span>🟢 12 rugs intercepted today</span>
<span>⚡ Median execution: 420ms</span>
<span>📉 Top 10 holder risk flagged</span>
<span>🔍 Bundler detected pre-launch</span>
</div>
</section> */}
{/* Why Nexa */}
<section className="relative z-10 px-6 py-24 max-w-7xl mx-auto"> <section className="relative z-10 px-6 py-24 max-w-7xl mx-auto">
<div className="grid md:grid-cols-3 gap-10"> <div className="grid md:grid-cols-3 gap-8">
<Staggered stagger={100}> <Staggered stagger={100}>
<Motion className="visible animate-fade-in-up"> {[
<div className="invisible"> {
<h3 className="text-xl font-medium mb-2"> icon: Shield,
Risk-aware by default title: "Stop Rugs Before They Happen",
</h3> desc: "Scans each token for risks like holder concentration, grouped wallets, deployer history, and liquidity issues. You see exactly what's wrong before you trade.",
<p className="text-muted-foreground"> },
Every trade is evaluated against holder concentration, {
bundlers, deployer behavior, and liquidity signals, before icon: Zap,
execution. title: "Built for Solana Speed",
</p> desc: "Optimized batching and Jupiter routing keep trades fast when the network is busy. Catch opportunities while they're still there.",
</div> },
</Motion> {
icon: TrendingDown,
<Motion className="visible animate-fade-in-up"> title: "Automated Risk Checks",
<div className="invisible"> desc: "AI handles wallet analysis, deployer vetting, and liquidity checks on every trade. Skip the manual work and focus on timing.",
<h3 className="text-xl font-medium mb-2"> },
AI where it matters ].map(({ icon: Icon, title, desc }, i) => (
</h3> <Motion
<p className="text-muted-foreground"> key={i}
No magic predictions. Just automated checks that experienced className="animate-fade-in-up animate-duration-500"
traders already do, instantly and consistently. >
</p> <div className="opacity-0 group">
</div> <div className="p-6 rounded-xl border border-border bg-card/50 hover:bg-card/80 transition-all hover:border-primary/50 h-full">
</Motion> <div className="w-12 h-12 rounded-lg bg-primary/10 flex items-center justify-center mb-4 group-hover:bg-primary/20 transition-colors">
<Icon className="w-6 h-6 text-primary" />
<Motion className="visible animate-fade-in-up"> </div>
<div className="invisible"> <h3 className="text-xl font-medium mb-3">{title}</h3>
<h3 className="text-xl font-medium mb-2">Built for speed</h3> <p className="text-muted-foreground text-sm leading-relaxed">
<p className="text-muted-foreground"> {desc}
Optimized request batching, Solana-native execution, and </p>
Jupiter routing keep latency low even during peak volume. </div>
</p> </div>
</div> </Motion>
</Motion> ))}
</Staggered> </Staggered>
</div> </div>
</section> </section>
{/* Risk interception highlight */}
<Motion className="animate-fade-in-left">
<section className="relative z-10 px-6 py-24 max-w-7xl mx-auto opacity-0">
<div className="rounded-2xl border border-border bg-card/60 backdrop-blur p-10">
<h2 className="text-3xl font-semibold mb-4">
Nexa can stop you before you buy a rug
</h2>
<p className="text-muted-foreground max-w-2xl">
When high-risk patterns are detected, Nexa blocks execution by
default and tells you exactly why. If you still want in, that's
your call. But it won't be blind.
</p>
</div>
</section>
</Motion>
{/* How it works */} {/* How it works */}
<section className="relative z-10 px-6 py-24 max-w-7xl mx-auto"> <section className="relative z-10 px-6 py-24 max-w-7xl mx-auto">
<h2 className="text-3xl font-semibold mb-12">How it works</h2> <h2 className="text-3xl font-semibold mb-12">How it works</h2>
<div className="grid md:grid-cols-4 gap-8 text-sm"> <div className="grid md:grid-cols-4 gap-6">
<div className="text-muted-foreground"> <Staggered stagger={150}>
<span className="block text-foreground font-medium mb-1"> {[
1. Detect {
</span> icon: Scan,
New pairs, migrations, and liquidity events are tracked in real step: "Detect",
time. desc: "New pairs, migrations, and liquidity events are tracked in real time.",
</div> },
<div className="text-muted-foreground"> {
<span className="block text-foreground font-medium mb-1"> icon: BarChart3,
2. Analyze step: "Analyze",
</span> desc: "Risk signals, holder distribution, and deployer behavior are scored.",
Risk signals, holder distribution, and deployer behavior are scored. },
</div> {
<div className="text-muted-foreground"> icon: Filter,
<span className="block text-foreground font-medium mb-1"> step: "Decide",
3. Decide desc: "AI filters or manual overrides determine execution eligibility.",
</span> },
AI filters or manual overrides determine execution eligibility. {
</div> icon: Send,
<div className="text-muted-foreground"> step: "Execute",
<span className="block text-foreground font-medium mb-1"> desc: "Trades are routed through Jupiter with minimal latency.",
4. Execute },
</span> ].map(({ icon: Icon, step, desc }, i) => (
Trades are routed through Jupiter with minimal latency. <Motion
</div> key={i}
</div> className="animate-fade-in-up"
</section> style={{ animationDelay: `${i * 100}ms` }}
>
{/* Fees & alignment */} <div className="opacity-0">
<section className="relative z-10 px-6 py-24 max-w-7xl mx-auto"> <div className="p-5 rounded-lg border border-border/50 bg-card/30 hover:bg-card/50 hover:border-primary/30 transition-all">
<div className="max-w-2xl"> <div className="w-10 h-10 rounded-lg bg-primary/10 flex items-center justify-center mb-3">
<h2 className="text-3xl font-semibold mb-4"> <Icon className="w-5 h-5 text-primary" />
Fees that scale with success </div>
</h2> <span className="block text-foreground font-semibold text-base mb-2">
<p className="text-muted-foreground"> {step}
Nexa charges a small platform fee on executed trades, with optional </span>
AI and quant features available per-use. No subscriptions. No hidden <p className="text-muted-foreground text-sm leading-relaxed">
incentives. {desc}
</p> </p>
</div>
</div>
</Motion>
))}
</Staggered>
</div> </div>
</section> </section>
</main> </main>