237 lines
9.3 KiB
TypeScript
237 lines
9.3 KiB
TypeScript
/**
|
|
* Forum module landing page — static HTML, no React.
|
|
*/
|
|
export function renderLanding(): string {
|
|
return `
|
|
<!-- Hero -->
|
|
<div class="rl-hero">
|
|
<span class="rl-tagline">rForum</span>
|
|
<h1 class="rl-heading" style="background:linear-gradient(135deg,#a5b4fc,#c4b5fd,#d8b4fe);-webkit-background-clip:text;background-clip:text">(You)rForum, your community.</h1>
|
|
<p class="rl-subtitle" style="background:linear-gradient(135deg,#a5b4fc,#c4b5fd,#d8b4fe);-webkit-background-clip:text;background-clip:text">Deploy Your Own Discourse Forum in Minutes</p>
|
|
<p class="rl-subtext">
|
|
Automated cloud provisioning for self-hosted Discourse.
|
|
No DevOps required. Choose your region, configure your settings, and go live.
|
|
</p>
|
|
<div class="rl-cta-row">
|
|
<a href="https://demo.rspace.online/rforum" class="rl-cta-primary" id="ml-primary">Get Started</a>
|
|
<a href="/create-space" class="rl-cta-secondary">Create a Space</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Features -->
|
|
<section class="rl-section">
|
|
<div class="rl-container">
|
|
<h2 class="rl-heading" style="text-align:center">What rForum Handles</h2>
|
|
<div class="rl-grid-4">
|
|
<div class="rl-card rl-card--center">
|
|
<div class="rl-icon-box">⚙</div>
|
|
<h3>Automated Provisioning</h3>
|
|
<p>One-click Discourse deployment. Server creation, installation, and configuration handled automatically.</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center">
|
|
<div class="rl-icon-box">☁</div>
|
|
<h3>Cloud VPS Deployment</h3>
|
|
<p>Deploy on Hetzner Cloud in Germany, Finland, or the US. Transparent pricing with no markup.</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center">
|
|
<div class="rl-icon-box">🌐</div>
|
|
<h3>DNS Integration</h3>
|
|
<p>Automatic DNS setup for your subdomain via Cloudflare. SSL certificates provisioned with Let's Encrypt.</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center">
|
|
<div class="rl-icon-box">🛠</div>
|
|
<h3>No DevOps Required</h3>
|
|
<p>No command line, no SSH — just fill in your settings and watch your forum come online.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- How It Works -->
|
|
<section class="rl-section rl-section--alt">
|
|
<div class="rl-container">
|
|
<h2 class="rl-heading" style="text-align:center">How It Works</h2>
|
|
<div class="rl-grid-3">
|
|
<div class="rl-step">
|
|
<div class="rl-step__num">1</div>
|
|
<h3>Configure</h3>
|
|
<p>Choose your subdomain, server region, and instance size. Add SMTP credentials for email delivery. Set your admin email.</p>
|
|
</div>
|
|
<div class="rl-step">
|
|
<div class="rl-step__num">2</div>
|
|
<h3>Provision</h3>
|
|
<p>We create a cloud server on Hetzner, install Discourse, configure SSL via Let's Encrypt, and set up DNS. Takes about 10-15 minutes.</p>
|
|
</div>
|
|
<div class="rl-step">
|
|
<div class="rl-step__num">3</div>
|
|
<h3>Go Live</h3>
|
|
<p>Your forum is ready. Log in as admin, customize your community, invite members, and start conversations. Full SSH access included.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Pricing -->
|
|
<section class="rl-section" id="pricing">
|
|
<div class="rl-container">
|
|
<h2 class="rl-heading" style="text-align:center">Transparent Pricing</h2>
|
|
<p class="rl-subtext" style="text-align:center">
|
|
Pay only for the cloud server. Hetzner pricing passed through directly — no markup.
|
|
</p>
|
|
<div class="rl-grid-3" style="margin-top:2rem">
|
|
<!-- Starter -->
|
|
<div class="rl-card">
|
|
<h3>Starter</h3>
|
|
<p style="font-size:0.82rem;color:#94a3b8;margin-bottom:1rem">Small communities</p>
|
|
<div style="font-size:2rem;font-weight:700;color:#e2e8f0;margin-bottom:0.25rem">
|
|
€3.79<span style="font-size:0.875rem;font-weight:400;color:#94a3b8">/mo</span>
|
|
</div>
|
|
<p style="font-size:0.75rem;color:#64748b;margin-bottom:1.25rem">Hetzner CX22</p>
|
|
<ul class="rl-check-list">
|
|
<li>2 vCPU cores</li>
|
|
<li>4 GB RAM</li>
|
|
<li>40 GB NVMe SSD</li>
|
|
<li>Up to ~500 users</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- Standard -->
|
|
<div class="rl-card" style="border-color:rgba(99,102,241,0.5)">
|
|
<span class="rl-badge" style="background:#6366f1;margin-bottom:0.5rem">RECOMMENDED</span>
|
|
<h3>Standard</h3>
|
|
<p style="font-size:0.82rem;color:#94a3b8;margin-bottom:1rem">Growing communities</p>
|
|
<div style="font-size:2rem;font-weight:700;color:#e2e8f0;margin-bottom:0.25rem">
|
|
€6.80<span style="font-size:0.875rem;font-weight:400;color:#94a3b8">/mo</span>
|
|
</div>
|
|
<p style="font-size:0.75rem;color:#64748b;margin-bottom:1.25rem">Hetzner CX32</p>
|
|
<ul class="rl-check-list">
|
|
<li>4 vCPU cores</li>
|
|
<li>8 GB RAM</li>
|
|
<li>80 GB NVMe SSD</li>
|
|
<li>Up to ~2,000 users</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- Performance -->
|
|
<div class="rl-card">
|
|
<h3>Performance</h3>
|
|
<p style="font-size:0.82rem;color:#94a3b8;margin-bottom:1rem">Large communities</p>
|
|
<div style="font-size:2rem;font-weight:700;color:#e2e8f0;margin-bottom:0.25rem">
|
|
€13.80<span style="font-size:0.875rem;font-weight:400;color:#94a3b8">/mo</span>
|
|
</div>
|
|
<p style="font-size:0.75rem;color:#64748b;margin-bottom:1.25rem">Hetzner CX42</p>
|
|
<ul class="rl-check-list">
|
|
<li>8 vCPU cores</li>
|
|
<li>16 GB RAM</li>
|
|
<li>160 GB NVMe SSD</li>
|
|
<li>Up to ~10,000 users</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- What You Get -->
|
|
<section class="rl-section rl-section--alt">
|
|
<div class="rl-container">
|
|
<h2 class="rl-heading" style="text-align:center">What You Get</h2>
|
|
<div class="rl-grid-3" style="margin-top:2rem">
|
|
<div class="rl-card rl-card--center">
|
|
<h3>Automated SSL</h3>
|
|
<p>Let's Encrypt certificates provisioned automatically during setup.</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center">
|
|
<h3>Multiple Regions</h3>
|
|
<p>Deploy in Germany, Finland, or the US East/West Coast.</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center">
|
|
<h3>Full SSH Access</h3>
|
|
<p>Your server, your rules. SSH in anytime for custom configuration.</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center">
|
|
<h3>One-Click Updates</h3>
|
|
<p>Discourse's built-in admin panel handles version upgrades.</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center">
|
|
<h3>DNS Management</h3>
|
|
<p>Automatic DNS setup for *.rforum.online subdomains.</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center">
|
|
<h3>Real-Time Logs</h3>
|
|
<p>Watch your forum provision step-by-step in the dashboard.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Built on Open Source -->
|
|
<section class="rl-section">
|
|
<div class="rl-container">
|
|
<h2 class="rl-heading" style="text-align:center">Built on Open Source</h2>
|
|
<p class="rl-subtext" style="text-align:center">The libraries and tools that power rForum.</p>
|
|
<div class="rl-grid-4">
|
|
<div class="rl-card rl-card--center">
|
|
<h3>Discourse</h3>
|
|
<p>The world's most popular open-source forum platform.</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center">
|
|
<h3>Hetzner Cloud API</h3>
|
|
<p>Automated VPS provisioning in multiple regions.</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center">
|
|
<h3>Cloudflare API</h3>
|
|
<p>DNS management and SSL termination.</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center">
|
|
<h3>Hono</h3>
|
|
<p>Ultra-fast, lightweight API framework powering the backend.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Your Data, Protected -->
|
|
<section class="rl-section rl-section--alt">
|
|
<div class="rl-container" style="text-align:center">
|
|
<h2 class="rl-heading">Your Data, Protected</h2>
|
|
<p class="rl-subtext">How rForum keeps your information safe.</p>
|
|
<div class="rl-grid-3">
|
|
<div class="rl-card rl-card--center">
|
|
<div class="rl-icon-box">🔒</div>
|
|
<h3>End-to-End Encryption</h3>
|
|
<span class="rl-badge">Coming Soon</span>
|
|
<p>All content encrypted before it leaves your device. Not even the server can read it.</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center">
|
|
<div class="rl-icon-box">🕵</div>
|
|
<h3>Zero-Knowledge Architecture</h3>
|
|
<span class="rl-badge">Coming Soon</span>
|
|
<p>The server processes your requests without ever seeing your data in the clear.</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center">
|
|
<div class="rl-icon-box">🏠</div>
|
|
<h3>Self-Hosted</h3>
|
|
<p>Run on your own infrastructure. Your server, your rules, your data.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- CTA -->
|
|
<section class="rl-section">
|
|
<div class="rl-container" style="text-align:center">
|
|
<h2 class="rl-heading">(You)rForum, your community.</h2>
|
|
<p class="rl-subtext">Try the demo or create a space to get started.</p>
|
|
<div class="rl-cta-row">
|
|
<a href="https://demo.rspace.online/rforum" class="rl-cta-primary">Get Started</a>
|
|
<a href="/create-space" class="rl-cta-secondary">Create a Space</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<div class="rl-back">
|
|
<a href="/">← Back to rSpace</a>
|
|
</div>
|
|
`;
|
|
}
|