Jon Staab
60 lines
2.5 KiB
TypeScript
60 lines
2.5 KiB
TypeScript
import { A } from "@solidjs/router"
|
|
|
|
export default function Home() {
|
|
return (
|
|
<div class="min-h-screen bg-white">
|
|
{/* Hero */}
|
|
<div class="max-w-4xl mx-auto px-4 py-24 text-center">
|
|
<h1 class="text-2xl font-bold text-gray-900 mb-4 py-4">
|
|
Host Your Own Nostr Community Relay
|
|
</h1>
|
|
<p class="text-xl text-gray-600 mb-8 max-w-2xl mx-auto">
|
|
Spin up a private, managed Nostr relay for your community in minutes.
|
|
Full control over membership, access, and policies.
|
|
</p>
|
|
<A
|
|
href="/relays/new"
|
|
class="inline-block py-3 px-8 bg-blue-600 text-white font-semibold rounded-lg hover:bg-blue-700 transition-colors"
|
|
>
|
|
Get Started
|
|
</A>
|
|
</div>
|
|
|
|
{/* Pricing */}
|
|
<div class="max-w-4xl mx-auto px-4 pb-24">
|
|
<h2 class="text-2xl font-bold text-center text-gray-900 mb-12">Pricing</h2>
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
|
|
<div class="border border-gray-200 rounded-xl p-6">
|
|
<h3 class="text-xl font-bold mb-2">Free</h3>
|
|
<p class="text-3xl font-bold mb-4">0 <span class="text-sm font-normal text-gray-500">sats/mo</span></p>
|
|
<ul class="space-y-2 text-gray-600">
|
|
<li>Up to 10 members</li>
|
|
<li class="line-through text-gray-400">Blossom storage</li>
|
|
<li class="line-through text-gray-400">LiveKit video</li>
|
|
</ul>
|
|
</div>
|
|
<div class="border-2 border-blue-600 rounded-xl p-6 relative">
|
|
<span class="absolute -top-3 left-1/2 -translate-x-1/2 bg-blue-600 text-white text-xs font-semibold px-3 py-1 rounded-full">Popular</span>
|
|
<h3 class="text-xl font-bold mb-2">Basic</h3>
|
|
<p class="text-3xl font-bold mb-4">10,000 <span class="text-sm font-normal text-gray-500">sats/mo</span></p>
|
|
<ul class="space-y-2 text-gray-600">
|
|
<li>Up to 100 members</li>
|
|
<li>Blossom storage</li>
|
|
<li>LiveKit video</li>
|
|
</ul>
|
|
</div>
|
|
<div class="border border-gray-200 rounded-xl p-6">
|
|
<h3 class="text-xl font-bold mb-2">Growth</h3>
|
|
<p class="text-3xl font-bold mb-4">50,000 <span class="text-sm font-normal text-gray-500">sats/mo</span></p>
|
|
<ul class="space-y-2 text-gray-600">
|
|
<li>Unlimited members</li>
|
|
<li>Blossom storage</li>
|
|
<li>LiveKit video</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|