landing Animations
This commit is contained in:
Generated
+18
-2
@@ -15,7 +15,9 @@
|
||||
"radix-ui": "^1.4.3",
|
||||
"react": "19.2.3",
|
||||
"react-dom": "19.2.3",
|
||||
"tailwind-merge": "^3.4.0"
|
||||
"tailwind-animations": "^1.0.1",
|
||||
"tailwind-merge": "^3.4.0",
|
||||
"tailwind-motlib": "^1.0.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@tailwindcss/postcss": "^4",
|
||||
@@ -7371,6 +7373,15 @@
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/tailwind-animations": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/tailwind-animations/-/tailwind-animations-1.0.1.tgz",
|
||||
"integrity": "sha512-5ouCdgfGS4kcyuzRSb/1O3o9f5Akssi7ue46PHfKjvPLMWjtnzmqM8i6ElES3tKVTyhjSaTPfLti7aB7WSxhZg==",
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"tailwindcss": "^4.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/tailwind-merge": {
|
||||
"version": "3.4.0",
|
||||
"resolved": "https://registry.npmjs.org/tailwind-merge/-/tailwind-merge-3.4.0.tgz",
|
||||
@@ -7381,11 +7392,16 @@
|
||||
"url": "https://github.com/sponsors/dcastil"
|
||||
}
|
||||
},
|
||||
"node_modules/tailwind-motlib": {
|
||||
"version": "1.0.4",
|
||||
"resolved": "https://registry.npmjs.org/tailwind-motlib/-/tailwind-motlib-1.0.4.tgz",
|
||||
"integrity": "sha512-4M80sHBTmXQn/fWo8xZYRDlr8yqLv4ZC2MzpHw8MsGPTbXV75Y3NW518ec3CWSiO3WSEZlhXfOHBKpxEvCuoRw==",
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/tailwindcss": {
|
||||
"version": "4.1.18",
|
||||
"resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-4.1.18.tgz",
|
||||
"integrity": "sha512-4+Z+0yiYyEtUVCScyfHCxOYP06L5Ne+JiHhY2IjR2KWMIWhJOYZKLSGZaP5HkZ8+bY0cxfzwDE5uOmzFXyIwxw==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/tapable": {
|
||||
|
||||
+3
-1
@@ -15,7 +15,9 @@
|
||||
"radix-ui": "^1.4.3",
|
||||
"react": "19.2.3",
|
||||
"react-dom": "19.2.3",
|
||||
"tailwind-merge": "^3.4.0"
|
||||
"tailwind-animations": "^1.0.1",
|
||||
"tailwind-merge": "^3.4.0",
|
||||
"tailwind-motlib": "^1.0.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@tailwindcss/postcss": "^4",
|
||||
|
||||
@@ -1,6 +1,9 @@
|
||||
@import "tailwindcss";
|
||||
@import "tw-animate-css";
|
||||
@import "shadcn/tailwind.css";
|
||||
@import 'tailwind-animations';
|
||||
|
||||
@tailwind utilities;
|
||||
|
||||
@custom-variant dark (&:is(.dark *));
|
||||
|
||||
|
||||
+29
-12
@@ -1,4 +1,6 @@
|
||||
"use client";
|
||||
import Link from "next/link";
|
||||
import { Motion, Staggered } from "tailwind-motlib";
|
||||
|
||||
export default function Landing() {
|
||||
return (
|
||||
@@ -55,45 +57,60 @@ export default function Landing() {
|
||||
{/* Why Nexa */}
|
||||
<section className="relative z-10 px-6 py-24 max-w-7xl mx-auto">
|
||||
<div className="grid md:grid-cols-3 gap-10">
|
||||
<div>
|
||||
<h3 className="text-xl font-medium mb-2">Risk-aware by default</h3>
|
||||
<Staggered stagger={100}>
|
||||
<Motion className="visible animate-fade-in-up">
|
||||
<div className="invisible">
|
||||
<h3 className="text-xl font-medium mb-2">
|
||||
Risk-aware by default
|
||||
</h3>
|
||||
<p className="text-muted-foreground">
|
||||
Every trade is evaluated against holder concentration, bundlers,
|
||||
deployer behavior, and liquidity signals, before execution.
|
||||
Every trade is evaluated against holder concentration,
|
||||
bundlers, deployer behavior, and liquidity signals, before
|
||||
execution.
|
||||
</p>
|
||||
</div>
|
||||
</Motion>
|
||||
|
||||
<div>
|
||||
<h3 className="text-xl font-medium mb-2">AI where it matters</h3>
|
||||
<Motion className="visible animate-fade-in-up">
|
||||
<div className="invisible">
|
||||
<h3 className="text-xl font-medium mb-2">
|
||||
AI where it matters
|
||||
</h3>
|
||||
<p className="text-muted-foreground">
|
||||
No magic predictions. Just automated checks that experienced
|
||||
traders already do, instantly and consistently.
|
||||
</p>
|
||||
</div>
|
||||
</Motion>
|
||||
|
||||
<div>
|
||||
<Motion className="visible animate-fade-in-up">
|
||||
<div className="invisible">
|
||||
<h3 className="text-xl font-medium mb-2">Built for speed</h3>
|
||||
<p className="text-muted-foreground">
|
||||
Optimized request batching, Solana-native execution, and Jupiter
|
||||
routing keep latency low even during peak volume.
|
||||
Optimized request batching, Solana-native execution, and
|
||||
Jupiter routing keep latency low even during peak volume.
|
||||
</p>
|
||||
</div>
|
||||
</Motion>
|
||||
</Staggered>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Risk interception highlight */}
|
||||
<section className="relative z-10 px-6 py-24 max-w-7xl mx-auto">
|
||||
<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.
|
||||
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 */}
|
||||
<section className="relative z-10 px-6 py-24 max-w-7xl mx-auto">
|
||||
|
||||
Reference in New Issue
Block a user