148 lines
6.2 KiB
TypeScript
148 lines
6.2 KiB
TypeScript
/**
|
||
* rLending landing page — trust-based distributed mortgages.
|
||
*/
|
||
export function renderLanding(): string {
|
||
return `
|
||
<!-- Hero -->
|
||
<div class="rl-hero">
|
||
<span class="rl-tagline">rLending</span>
|
||
<h1 class="rl-heading">Mortgages at the speed of trust.</h1>
|
||
<p class="rl-subtitle">Distributed lending, community-funded tranches.</p>
|
||
<p class="rl-subtext">
|
||
A 30-year mortgage split into 80 tranches of $5k, each funded by a neighbor, backed by
|
||
social trust instead of a credit score. Reinvestment loops turn idle capital into yield.
|
||
A secondary market lets lenders exit when they need to.
|
||
</p>
|
||
<div class="rl-cta-row">
|
||
<a href="https://demo.rspace.online/rlending" class="rl-cta-primary" id="ml-primary">Open Simulator</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 rLending Handles</h2>
|
||
<div class="rl-grid-4">
|
||
<div class="rl-card rl-card--center">
|
||
<div class="rl-icon-box">🤝</div>
|
||
<h3>Trust-Backed Lending</h3>
|
||
<p>Underwriting from your community, not a bureau. Trust scores from rNetwork relationships and rCred reputation replace FICO.</p>
|
||
</div>
|
||
<div class="rl-card rl-card--center">
|
||
<div class="rl-icon-box">🧺</div>
|
||
<h3>Distributed Tranches</h3>
|
||
<p>One mortgage, many lenders. Each lender picks a term (2yr–30yr) and rate, funding a $1k–$5k slice of principal.</p>
|
||
</div>
|
||
<div class="rl-card rl-card--center">
|
||
<div class="rl-icon-box">📈</div>
|
||
<h3>Reinvestment Loops</h3>
|
||
<p>Repayments auto-roll into new tranches or external DeFi yield (Aave v3, Morpho Blue). Compounds while borrowers pay down principal.</p>
|
||
</div>
|
||
<div class="rl-card rl-card--center">
|
||
<div class="rl-icon-box">🔅</div>
|
||
<h3>Secondary Market</h3>
|
||
<p>Lenders can list their tranche for sale at any time. Buyers step in, premium is set by supply and demand.</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">
|
||
<span class="rl-step__num">1</span>
|
||
<h3>Borrower Posts Terms</h3>
|
||
<p>Property value, down payment, term, rate. The simulator splits the principal into configurable tranches and tiers.</p>
|
||
</div>
|
||
<div class="rl-step">
|
||
<span class="rl-step__num">2</span>
|
||
<h3>Community Funds the Tranches</h3>
|
||
<p>Lenders in the space claim tranches that match their risk tolerance and time horizon. Trust from your network gates access.</p>
|
||
</div>
|
||
<div class="rl-step">
|
||
<span class="rl-step__num">3</span>
|
||
<h3>Payments Flow & Compound</h3>
|
||
<p>Monthly payments amortize each tranche. Reinvestment rules auto-deploy idle capital to new tranches or Aave/Morpho.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Pool Economics -->
|
||
<section class="rl-section">
|
||
<div class="rl-container">
|
||
<div class="rl-grid-2">
|
||
<div>
|
||
<h2 class="rl-heading">Pool economics, not banks</h2>
|
||
<p class="rl-subtext" style="margin-bottom:1.5rem">
|
||
Every dollar stays in the community. Interest that would have left as bank profit now recycles as yield for neighbors.
|
||
</p>
|
||
<ul class="rl-check-list">
|
||
<li><strong>Variable terms</strong> — 2yr, 5yr, 10yr, 15yr, 30yr tiers with tiered rates</li>
|
||
<li><strong>Overpayment</strong> — extra principal, community fund contributions, or split</li>
|
||
<li><strong>Pool reinvestment</strong> — idle capital earns Aave v3 supply APY until redeployed</li>
|
||
<li><strong>Simulation modes</strong> — mycelial, flow, grid, lender, borrower views</li>
|
||
</ul>
|
||
</div>
|
||
<div class="rl-card rl-card--center" style="display:flex;align-items:center;justify-content:center">
|
||
<div>
|
||
<div class="rl-icon-box" style="margin:0 auto 1rem">📈</div>
|
||
<h3>Aave v3 + Morpho Blue</h3>
|
||
<p>Live pool reinvestment.<br>APY updates on every block.</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 rLending.</p>
|
||
<div class="rl-grid-4">
|
||
<div class="rl-card rl-card--center">
|
||
<div class="rl-icon-box">⚖</div>
|
||
<h3>ERC-20 & Aave</h3>
|
||
<p>Open stablecoin rails. Supply to Aave v3 for idle pool capital, borrow against positions for leverage.</p>
|
||
</div>
|
||
<div class="rl-card rl-card--center">
|
||
<div class="rl-icon-box">🌠</div>
|
||
<h3>rNetwork Trust Graph</h3>
|
||
<p>Underwriting draws on your community's trust edges, not an opaque credit score.</p>
|
||
</div>
|
||
<div class="rl-card rl-card--center">
|
||
<div class="rl-icon-box">📡</div>
|
||
<h3>Automerge CRDT</h3>
|
||
<p>Positions and tranches sync live across lenders. No central ledger, no single point of failure.</p>
|
||
</div>
|
||
<div class="rl-card rl-card--center">
|
||
<div class="rl-icon-box">🔥</div>
|
||
<h3>Hono</h3>
|
||
<p>Ultrafast API layer. Lightweight and edge-ready.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- CTA -->
|
||
<section class="rl-section">
|
||
<div class="rl-container" style="text-align:center">
|
||
<h2 class="rl-heading">Model a mortgage your whole block can fund.</h2>
|
||
<p class="rl-subtext">Run the simulator and see how your community can replace the bank.</p>
|
||
<div class="rl-cta-row">
|
||
<a href="https://demo.rspace.online/rlending" class="rl-cta-primary">Open Simulator</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>`;
|
||
}
|