userAdityaa/caravel
1
1
Fork 0
forked from coracle/caravel
Code Pull Requests Activity

Create frontend project

Browse Source
This commit is contained in:
Jon Staab
2026-02-25 14:55:36 -08:00
parent c84b003a57
commit 9bc6c42aee
32 changed files with 1339 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/pages/Home.tsx
+59
View File
@@ -0,0 +1,59 @@
import { A } from "@solidjs/router"
export default function Home() {
return (
<div class="min-h-screen bg-white">
{/* Hero */}
<div class="max-w-5xl mx-auto px-4 py-24 text-center">
<h1 class="text-5xl font-bold text-gray-900 mb-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-5xl mx-auto px-4 pb-24">
<h2 class="text-3xl 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>
)
}