174 lines
6.6 KiB
TypeScript
174 lines
6.6 KiB
TypeScript
/**
|
|
* rWallet — rich landing page body.
|
|
* Returned by landingPage() in the module export;
|
|
* the shell wraps it with header, CSS, and analytics.
|
|
*/
|
|
export function renderLanding(): string {
|
|
return `
|
|
<!-- Hero -->
|
|
<div class="rl-hero">
|
|
<span class="rl-tagline">rWallet</span>
|
|
<h1 class="rl-heading">(You)rWallet, your treasury laid bare.</h1>
|
|
<p class="rl-subtitle">Community Treasury, Transparent</p>
|
|
<p class="rl-subtext">
|
|
Visualize your Safe multisig across every chain — balances,
|
|
transactions, and governance — all in one client-side dashboard.
|
|
No backend database, no custody risk.
|
|
</p>
|
|
<div class="rl-cta-row">
|
|
<a href="https://demo.rspace.online/rwallet" class="rl-cta-primary" id="ml-primary">View Treasury</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 rWallet Handles</h2>
|
|
<div class="rl-grid-3">
|
|
<div class="rl-card rl-card--center">
|
|
<div class="rl-icon-box">⛓</div>
|
|
<h3>Gnosis Safe Visualization</h3>
|
|
<p>Paste any Safe address and see balances, signers, and thresholds across all detected chains instantly.</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center">
|
|
<div class="rl-icon-box">🔗</div>
|
|
<h3>Multichain Support</h3>
|
|
<p>Ethereum, Polygon, Base, Gnosis, Arbitrum, Optimism, Celo, Avalanche, BSC, and zkSync in one view.</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center">
|
|
<div class="rl-icon-box">📋</div>
|
|
<h3>Transaction History</h3>
|
|
<p>Browse incoming and outgoing transfers with human-readable labels and USD values.</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center">
|
|
<div class="rl-icon-box">🔐</div>
|
|
<h3>Governance Dashboard</h3>
|
|
<p>See signer thresholds, pending confirmations, and execution status at a glance.</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center">
|
|
<div class="rl-icon-box">🛡</div>
|
|
<h3>No Custody Risk</h3>
|
|
<p>Client-side only. rWallet reads your Safe data but never holds keys or moves funds.</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>Connect Your Safe Address</h3>
|
|
<p>Paste any Safe address. rWallet auto-detects which chains it lives on.</p>
|
|
</div>
|
|
<div class="rl-step">
|
|
<div class="rl-step__num">2</div>
|
|
<h3>See Balances Across All Chains</h3>
|
|
<p>See token balances, USD valuations, and transaction history for every chain in one view.</p>
|
|
</div>
|
|
<div class="rl-step">
|
|
<div class="rl-step__num">3</div>
|
|
<h3>Review Transactions and Governance</h3>
|
|
<p>Review pending multisig transactions and coordinate approvals with your team.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Ecosystem Integration -->
|
|
<section class="rl-section">
|
|
<div class="rl-container">
|
|
<h2 class="rl-heading" style="text-align:center">Ecosystem Integration</h2>
|
|
<p class="rl-subtext" style="text-align:center">
|
|
rWallet connects to other rSpace modules for a complete treasury workflow.
|
|
</p>
|
|
<div class="rl-grid-2">
|
|
<div class="rl-integration">
|
|
<div class="rl-icon-box">📈</div>
|
|
<div>
|
|
<h3><a href="/rfunds" style="color:#14b8a6;text-decoration:none">rFunds</a></h3>
|
|
<p>Overlay budget categories on your wallet data to see where funds are allocated and how they flow.</p>
|
|
</div>
|
|
</div>
|
|
<div class="rl-integration">
|
|
<div class="rl-icon-box">☑</div>
|
|
<div>
|
|
<h3><a href="/rvote" style="color:#14b8a6;text-decoration:none">rVote</a></h3>
|
|
<p>Link governance proposals directly to treasury transactions for full accountability.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Built on Open Source -->
|
|
<section class="rl-section rl-section--alt">
|
|
<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 rWallet.</p>
|
|
<div class="rl-grid-3">
|
|
<div class="rl-card rl-card--center">
|
|
<h3>Gnosis Safe API</h3>
|
|
<p>Multisig wallet data across all supported chains via the Safe transaction service.</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center">
|
|
<h3>Safe Global SDK</h3>
|
|
<p>Official SDK for querying Safe balances, transactions, and signer information.</p>
|
|
</div>
|
|
<div class="rl-card rl-card--center">
|
|
<h3>Hono</h3>
|
|
<p>Ultra-fast, lightweight API framework powering the rWallet backend.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Your Data, Protected -->
|
|
<section class="rl-section">
|
|
<div class="rl-container" style="text-align:center">
|
|
<h2 class="rl-heading">Your Data, Protected</h2>
|
|
<p class="rl-subtext">How rWallet 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 rl-section--alt">
|
|
<div class="rl-container" style="text-align:center">
|
|
<h2 class="rl-heading">(You)rWallet, your treasury laid bare.</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/rwallet" class="rl-cta-primary">View Treasury</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>
|
|
`;
|
|
}
|