154 lines
7.7 KiB
TypeScript
154 lines
7.7 KiB
TypeScript
/**
|
|
* Inbox module landing page — static HTML, no React.
|
|
*/
|
|
export function renderLanding(): string {
|
|
return `
|
|
<!-- Hero -->
|
|
<div class="rl-hero">
|
|
<span class="rl-tagline" style="color:#06b6d4;background:rgba(6,182,212,0.1);border-color:rgba(6,182,212,0.2)">rInbox</span>
|
|
<h1 class="rl-heading" style="background:linear-gradient(135deg,#67e8f9,#93c5fd,#c4b5fd);-webkit-background-clip:text;background-clip:text">
|
|
Collaborative Multi-Sig Inbox
|
|
</h1>
|
|
<p class="rl-subtext">
|
|
A shared email client where teams read, discuss, and approve messages
|
|
together — with cryptographic multi-signature workflows before anything gets sent.
|
|
</p>
|
|
<div class="rl-cta-row">
|
|
<a href="https://demo.rspace.online/rinbox" class="rl-cta-primary" id="ml-primary"
|
|
style="background:linear-gradient(135deg,#0891b2,#0e7490)">Open Inbox</a>
|
|
<a href="/create-space" class="rl-cta-secondary">Create a Space</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- How it Works -->
|
|
<section class="rl-section">
|
|
<div class="rl-container">
|
|
<h2 class="rl-heading" style="text-align:center;background:linear-gradient(135deg,#67e8f9,#93c5fd);-webkit-background-clip:text;background-clip:text">How It Works</h2>
|
|
<div class="rl-grid-3" style="margin-top:2rem">
|
|
<div class="rl-card">
|
|
<div class="rl-icon-box" style="background:rgba(6,182,212,0.12);color:#06b6d4">
|
|
<svg width="24" height="24" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
|
|
</svg>
|
|
</div>
|
|
<h3>1. Connect Mailbox</h3>
|
|
<p>
|
|
Your team shares one real email address. Every member sees every thread
|
|
in real-time — no forwarding, no BCC chains, no lost context.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="rl-card">
|
|
<div class="rl-icon-box" style="background:rgba(59,130,246,0.12);color:#3b82f6">
|
|
<svg width="24" height="24" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M17 8h2a2 2 0 012 2v6a2 2 0 01-2 2h-2v4l-4-4H9a1.994 1.994 0 01-1.414-.586m0 0L11 14h4a2 2 0 002-2V6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2v4l.586-.586z" />
|
|
</svg>
|
|
</div>
|
|
<h3>2. Triage Together</h3>
|
|
<p>
|
|
Comment on any thread privately before replying. Tag members,
|
|
discuss strategy, and reach consensus — all alongside the original message.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="rl-card">
|
|
<div class="rl-icon-box" style="background:rgba(139,92,246,0.12);color:#8b5cf6">
|
|
<svg width="24" height="24" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" />
|
|
</svg>
|
|
</div>
|
|
<h3>3. Approve with Multi-Sig</h3>
|
|
<p>
|
|
Outbound emails require M-of-N cryptographic signatures before sending.
|
|
Every approval is auditable — no rogue replies.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Collaboration Features -->
|
|
<section class="rl-section rl-section--alt">
|
|
<div class="rl-container">
|
|
<h2 class="rl-heading" style="text-align:center;background:linear-gradient(135deg,#67e8f9,#93c5fd);-webkit-background-clip:text;background-clip:text">
|
|
Collaboration Features
|
|
</h2>
|
|
<p class="rl-subtext" style="text-align:center">Built for collective intelligence, not individual productivity.</p>
|
|
<div class="rl-grid-2" style="margin-top:2rem">
|
|
<div class="rl-card">
|
|
<h3 style="color:#06b6d4;margin-bottom:0.75rem">Real-Time Collaboration</h3>
|
|
<ul class="rl-check-list">
|
|
<li><strong>Threaded Comments</strong> — discuss any email privately before replying</li>
|
|
<li><strong>Draft Reviews</strong> — collaborative draft editing with inline suggestions</li>
|
|
<li><strong>Forwarding Rules</strong> — route incoming messages by sender, subject, or tag</li>
|
|
<li><strong>Inline Signatures</strong> — per-mailbox signature templates with merge fields</li>
|
|
<li><strong>Read Receipts</strong> — see who has read each thread and when</li>
|
|
</ul>
|
|
</div>
|
|
<div class="rl-card">
|
|
<h3 style="color:#8b5cf6;margin-bottom:0.75rem">Approval Workflows</h3>
|
|
<ul class="rl-check-list">
|
|
<li><strong>Multi-sig sending</strong> — outbound emails require M-of-N approval</li>
|
|
<li><strong>Configurable thresholds</strong> — set approval requirements per mailbox</li>
|
|
<li><strong>Audit trail</strong> — every approval, rejection, and edit is logged</li>
|
|
<li><strong>Role-based access</strong> — Admin, Reviewer, Approver, Viewer, Bot</li>
|
|
<li><strong>Deadline alerts</strong> — notifications when approvals are waiting</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Team Roles -->
|
|
<section class="rl-section">
|
|
<div class="rl-container">
|
|
<h2 class="rl-heading" style="text-align:center;background:linear-gradient(135deg,#67e8f9,#93c5fd);-webkit-background-clip:text;background-clip:text">
|
|
Team Roles
|
|
</h2>
|
|
<p class="rl-subtext" style="text-align:center">Fine-grained access control for every team member.</p>
|
|
<div style="display:grid;grid-template-columns:repeat(5,1fr);gap:0.75rem;margin-top:2rem">
|
|
<div class="rl-card rl-card--center" style="padding:1.25rem">
|
|
<p style="font-size:0.875rem;font-weight:600;color:#06b6d4">Admin</p>
|
|
<p style="font-size:0.75rem;color:#64748b;margin-top:0.35rem">Full control, manage members</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center" style="padding:1.25rem">
|
|
<p style="font-size:0.875rem;font-weight:600;color:#3b82f6">Reviewer</p>
|
|
<p style="font-size:0.75rem;color:#64748b;margin-top:0.35rem">Read, comment, suggest edits</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center" style="padding:1.25rem">
|
|
<p style="font-size:0.875rem;font-weight:600;color:#8b5cf6">Approver</p>
|
|
<p style="font-size:0.75rem;color:#64748b;margin-top:0.35rem">Sign outbound emails</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center" style="padding:1.25rem">
|
|
<p style="font-size:0.875rem;font-weight:600;color:#94a3b8">Viewer</p>
|
|
<p style="font-size:0.75rem;color:#64748b;margin-top:0.35rem">Read-only access</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center" style="padding:1.25rem">
|
|
<p style="font-size:0.875rem;font-weight:600;color:#94a3b8">Bot</p>
|
|
<p style="font-size:0.75rem;color:#64748b;margin-top:0.35rem">Automated integrations</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- CTA -->
|
|
<section class="rl-section rl-section--alt">
|
|
<div class="rl-container" style="text-align:center">
|
|
<h2 class="rl-heading" style="background:linear-gradient(135deg,#67e8f9,#93c5fd);-webkit-background-clip:text;background-clip:text">
|
|
Start collaborating on email
|
|
</h2>
|
|
<p class="rl-subtext">
|
|
Sign in with your passkey to join a shared inbox.
|
|
</p>
|
|
<div class="rl-cta-row">
|
|
<a href="https://demo.rspace.online/rinbox" class="rl-cta-primary"
|
|
style="background:linear-gradient(135deg,#0891b2,#0e7490)">Open Inbox</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>
|
|
`;
|
|
}
|