Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
35 changes: 28 additions & 7 deletions frontend/src/components/landing/assistant-section.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,28 +11,41 @@ import {
Search,
Sparkles,
ArrowRight,
Check,
} from "lucide-react";

const capabilities = [
{
icon: Hash,
title: "Look up any stream",
text: "Drop in a stream ID and see status, deposit, and exactly what's claimable right now.",
points: [
"Drop in a stream ID for status, deposit, and rate",
"See exactly what's claimable right now",
],
},
{
icon: User,
title: "Search by address",
text: "Paste a sender or recipient address to pull every stream flowing in or out of it.",
points: [
"Paste any sender or recipient address",
"Pull every stream flowing in or out of it",
],
},
{
icon: Building2,
title: "Inspect a workspace",
text: "Check a registered DAO or business — streams created, total deposited, active status.",
points: [
"Check any registered DAO or business",
"Streams created, total deposited, active status",
],
},
{
icon: Zap,
title: "Read the chain live",
text: "Ask for the current block height and other on-chain state without leaving the app.",
points: [
"Ask for the current block height",
"Read on-chain state without leaving the app",
],
},
];

Expand Down Expand Up @@ -159,9 +172,17 @@ export function AssistantSection() {
<h3 className="text-sm font-semibold text-zinc-200">
{cap.title}
</h3>
<p className="mt-1 text-xs leading-relaxed text-zinc-500">
{cap.text}
</p>
<ul className="mt-2 space-y-1.5">
{cap.points.map((point) => (
<li
key={point}
className="flex items-start gap-1.5 text-xs leading-relaxed text-zinc-500"
>
<Check className="mt-0.5 h-3 w-3 shrink-0 text-brand-400" />
<span>{point}</span>
</li>
))}
</ul>
</div>
))}
</div>
Expand Down
51 changes: 36 additions & 15 deletions frontend/src/components/landing/features.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,44 +8,57 @@ import {
Clock,
Coins,
Network,
Check,
} from "lucide-react";

const features = [
{
icon: Bitcoin,
title: "Settled on Bitcoin",
description:
"Every stream is anchored to Bitcoin and can't be reversed once final. No other chain can stream money with Bitcoin-grade settlement.",
points: [
"Every stream is anchored to Bitcoin, final once settled",
"Can't be reversed — Bitcoin-grade settlement no other chain streams with",
],
},
{
icon: Zap,
title: "Real-time, every few seconds",
description:
"Funds flow every few seconds, not every payday. Recipients watch earnings add up live and claim any moment.",
points: [
"Funds flow every few seconds, not every payday",
"Recipients watch earnings add up live and claim any moment",
],
},
{
icon: Shield,
title: "Your money stays yours",
description:
"Tokens sit in audited on-chain escrow. Recipients only ever claim what they've earned, and you reclaim everything else instantly.",
points: [
"Tokens sit in audited on-chain escrow",
"Recipients claim only what they've earned; you reclaim the rest instantly",
],
},
{
icon: Clock,
title: "Full lifecycle control",
description:
"Pause, resume, top up, or cancel on demand. Anything not yet earned always comes back to the sender.",
points: [
"Pause, resume, top up, or cancel on demand",
"Anything not yet earned always comes back to the sender",
],
},
{
icon: Coins,
title: "Stream any asset",
description:
"sBTC, STX, USDA, ALEX, or any SIP-010 token. Stream real Bitcoin, by the second.",
points: [
"sBTC, STX, USDA, ALEX, or any SIP-010 token",
"Stream real Bitcoin, by the second",
],
},
{
icon: Network,
title: "Cross-chain and private, on the roadmap",
description:
"Coming next: pay out across other chains through sBTC bridges, plus shielded streams for private payroll on Bitcoin. The moat we're building toward.",
points: [
"Coming next: pay out across other chains through sBTC bridges",
"Shielded streams for private payroll — the moat we're building toward",
],
},
];

Expand Down Expand Up @@ -77,9 +90,17 @@ export function Features() {
<feature.icon className="h-5 w-5" />
</div>
<h3 className="text-base font-semibold text-zinc-200">{feature.title}</h3>
<p className="mt-2 text-sm leading-relaxed text-zinc-500">
{feature.description}
</p>
<ul className="mt-3 space-y-2">
{feature.points.map((point) => (
<li
key={point}
className="flex items-start gap-2 text-sm leading-relaxed text-zinc-500"
>
<Check className="mt-0.5 h-4 w-4 shrink-0 text-brand-400" />
<span>{point}</span>
</li>
))}
</ul>
</motion.div>
))}
</div>
Expand Down
46 changes: 35 additions & 11 deletions frontend/src/components/landing/who-its-for.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,29 +17,45 @@ const segments = [
icon: Landmark,
title: "DAOs & protocol teams",
headline: "Payday that runs itself",
description:
"Open one stream for each contributor, set the rate, and you are done. They watch their pay grow every second and cash out whenever they like. Need to change something? Pause, top up, or stop in a click, and anything not yet earned comes straight back to your treasury. Register your DAO once so every payment is on the record for members to see.",
points: [
"One stream per contributor — set the rate and you're done",
"They watch pay grow live and cash out whenever they like",
"Pause, top up, or stop in a click; unearned funds return to treasury",
"Register your DAO so every payment is on the record for members",
],
},
{
icon: Store,
title: "Merchants & SaaS",
headline: "Subscriptions that feel fair",
description:
"Stop charging upfront and hoping it sticks. Set up a stream with your customer and the money flows in second by second for as long as they stay. If they cancel, it stops on the spot, so no chargebacks and no disputes. Pay your own suppliers the very same way.",
points: [
"Money flows in second by second for as long as they stay",
"No upfront charge — if they cancel, it stops on the spot",
"No chargebacks and no disputes",
"Pay your own suppliers the very same way",
],
},
{
icon: Laptop,
title: "Freelancers & builders",
headline: "Watch your pay grow as you work",
description:
"Send your client your address, agree an amount and a length, and the stream handles the rest. Your balance ticks up live while you build, and you pull it to your wallet any moment you want. No invoice, no chasing, no 30 day wait. Get paid in sBTC, STX, or any token you choose.",
points: [
"Share your address, agree an amount and a length — done",
"Balance ticks up live while you build; pull it anytime",
"No invoice, no chasing, no 30-day wait",
"Get paid in sBTC, STX, or any token you choose",
],
},
{
icon: Target,
title: "Grant & bounty programs",
headline: "Fund builders, keep control",
description:
"Stream a grant across the whole project instead of handing over one lump sum. The builder earns steadily as they ship, and whatever is not yet earned stays in your wallet to pause or pull back if plans change. No escrow agent, no awkward refunds. We fund our own work exactly like this.",
points: [
"Stream a grant across the whole project, not one lump sum",
"Builders earn steadily as they ship",
"Unearned funds stay in your wallet to pause or pull back",
"No escrow agent, no awkward refunds — we fund our work this way",
],
},
];

Expand Down Expand Up @@ -200,9 +216,17 @@ export function WhoItsFor() {
<h3 className="text-lg font-semibold text-zinc-100">
{segment.headline}
</h3>
<p className="mt-2 text-sm leading-relaxed text-zinc-400">
{segment.description}
</p>
<ul className="mt-3 space-y-2">
{segment.points.map((point) => (
<li
key={point}
className="flex items-start gap-2 text-sm leading-relaxed text-zinc-400"
>
<Check className="mt-0.5 h-4 w-4 shrink-0 text-brand-400" />
<span>{point}</span>
</li>
))}
</ul>
</motion.div>
))}
</div>
Expand Down
Loading