adding about section

This commit is contained in:
2025-10-26 16:55:34 -04:00
parent a1e73df30a
commit c9ce0d065e
2 changed files with 226 additions and 5 deletions

204
src/app/about/page.tsx Normal file
View File

@@ -0,0 +1,204 @@
'use client';
import { useTranslation } from 'react-i18next';
import { Card } from '@/components/ui/card';
export default function AboutPage() {
const { t } = useTranslation();
return (
<div className="w-full max-w-5xl mx-auto space-y-8">
{/* Header */}
<div className="text-center space-y-4">
<h1 className="text-4xl font-bold bg-gradient-to-r from-primary to-purple-400 bg-clip-text text-transparent">
About Liquidity Party
</h1>
<p className="text-xl text-muted-foreground max-w-3xl mx-auto">
A game-theoretic multi-asset AMM revolutionizing decentralized exchange
</p>
</div>
{/* Introduction */}
<Card className="p-8 space-y-4">
<h2 className="text-2xl font-semibold">Introduction</h2>
<p className="text-muted-foreground leading-relaxed">
Liquidity Party is a new game-theoretic multi-asset AMM based on the groundbreaking paper:
</p>
<div className="bg-muted p-4 rounded-lg italic">
<a
href="https://mason.gmu.edu/~rhanson/mktscore.pdf"
target="_blank"
rel="noopener noreferrer"
className="text-sm text-primary hover:underline"
>
Logarithmic Market Scoring Rules for Modular Combinatorial Information Aggregation (R. Hanson, 2002)
</a>
</div>
<p className="text-muted-foreground leading-relaxed">
A Logarithmic Market Scoring Rule (LMSR) is a pricing formula for AMMs that know only their current asset
inventories and no other information, naturally supporting multi-asset pools.
</p>
</Card>
{/* Key Advantages */}
<Card className="p-8 space-y-4">
<h2 className="text-2xl font-semibold">Advantages Over Constant Product Markets</h2>
<div className="grid md:grid-cols-2 gap-4">
<div className="p-4 bg-muted rounded-lg">
<h3 className="font-semibold text-primary mb-2">Less Slippage</h3>
<p className="text-sm text-muted-foreground">
Reduced slippage for small and medium trade sizes compared to CP markets
</p>
</div>
<div className="p-4 bg-muted rounded-lg">
<h3 className="font-semibold text-primary mb-2">N-Asset Pools</h3>
<p className="text-sm text-muted-foreground">
Trade long-tail pairs in a single hop with multi-asset support
</p>
</div>
<div className="p-4 bg-muted rounded-lg">
<h3 className="font-semibold text-primary mb-2">Lower Fees</h3>
<p className="text-sm text-muted-foreground">
Smaller spread means more cost-effective trading
</p>
</div>
<div className="p-4 bg-muted rounded-lg">
<h3 className="font-semibold text-primary mb-2">Deeper Liquidity</h3>
<p className="text-sm text-muted-foreground">
Enhanced liquidity depth for better trading execution
</p>
</div>
</div>
<p className="text-muted-foreground leading-relaxed mt-4">
According to game theory, CP's slope at the current marginal price is too steep, overcharging takers
with too much slippage at small and medium trade sizes. LMSR pools offer less slippage and cheaper
liquidity for the small and medium trade sizes common for arbitrageurs and aggregators.
</p>
</Card>
{/* Multi-Asset */}
<Card className="p-8 space-y-6">
<div className="space-y-4">
<h2 className="text-2xl font-semibold">Multi-Asset Capabilities</h2>
<p className="text-muted-foreground leading-relaxed">
Naturally multi-asset, Liquidity Party altcoin pools provide direct, one-hop swaps on otherwise
illiquid multi-hop pairs. Pools will quote any pair combination available in the pool:
</p>
</div>
{/* Performance Table */}
<div className="overflow-x-auto">
<table className="w-full border-collapse">
<thead>
<tr className="border-b">
<th className="text-left p-3 font-semibold">Assets</th>
<th className="text-left p-3 font-semibold">Pairs</th>
<th className="text-left p-3 font-semibold">Swap Gas</th>
<th className="text-left p-3 font-semibold">Mint Gas</th>
</tr>
</thead>
<tbody className="text-muted-foreground">
<tr className="border-b hover:bg-muted/50 transition-colors">
<td className="p-3">2</td>
<td className="p-3">1</td>
<td className="p-3">131,000</td>
<td className="p-3">143,000</td>
</tr>
<tr className="border-b hover:bg-muted/50 transition-colors">
<td className="p-3">2*</td>
<td className="p-3">1</td>
<td className="p-3">118,000</td>
<td className="p-3">143,000</td>
</tr>
<tr className="border-b hover:bg-muted/50 transition-colors">
<td className="p-3">10</td>
<td className="p-3">45</td>
<td className="p-3">142,000</td>
<td className="p-3">412,000</td>
</tr>
<tr className="border-b hover:bg-muted/50 transition-colors">
<td className="p-3">20</td>
<td className="p-3">190</td>
<td className="p-3">157,000</td>
<td className="p-3">749,000</td>
</tr>
<tr className="border-b hover:bg-muted/50 transition-colors">
<td className="p-3">50</td>
<td className="p-3">1,225</td>
<td className="p-3">199,000</td>
<td className="p-3">1,760,000</td>
</tr>
<tr className="hover:bg-muted/50 transition-colors">
<td className="p-3">100</td>
<td className="p-3">4,950</td>
<td className="p-3">269,000</td>
<td className="p-3">2,684,000</td>
</tr>
</tbody>
</table>
<p className="text-xs text-muted-foreground mt-2">* Stablecoin pair pool optimization</p>
</div>
<p className="text-muted-foreground leading-relaxed">
Liquidity Party aggregates scarce, low market cap assets into a single pool, providing one-hop liquidity
for exotic pairs without fragmenting LP assets. CP pools would need 190x the LP assets to provide the same
pairwise liquidity as a single 20-asset Liquidity Party pool, due to asset fragmentation.
</p>
</Card>
{/* Lower Fees & Minimized IL */}
<Card className="p-8 space-y-6">
<div className="space-y-4">
<h2 className="text-2xl font-semibold">Lower Fees</h2>
<p className="text-muted-foreground leading-relaxed">
Since market makers offer the option to take either side of the market, they must receive a subsidy
or charge a fee (spread) to compensate for adverse selection (impermanent loss). By protecting LPs
against common value-extraction scenarios, LMSR pools have a reduced risk premium resulting in lower
fees for takers.
</p>
</div>
<div className="space-y-4 border-t pt-6">
<h2 className="text-2xl font-semibold">Minimized Impermanent Loss</h2>
<h3 className="text-xl font-semibold text-primary">No Intra-Pool Arbitrage</h3>
<p className="text-muted-foreground leading-relaxed">
LMSR minimizes impermanent loss for liquidity providers. Traditional CP pools expose LPs to value
extraction, leading to higher fee demands than theoretically necessary. By minimizing impermanent
loss for LPs, LMSR pools reduce the risk premium, providing lower fees and higher liquidity for takers.
</p>
</div>
</Card>
{/* Open Source Development */}
<Card className="p-8 space-y-4">
<h2 className="text-2xl font-semibold">Open Source Development</h2>
<p className="text-muted-foreground leading-relaxed">
Liquidity Party is built in the open — transparently, collaboratively, and for the benefit of the broader DeFi ecosystem.
Our full codebase is available under open-source licenses found here:{' '}
<a
href="https://git.dxod.org/explore/repos"
target="_blank"
rel="noopener noreferrer"
className="text-primary hover:underline"
>
https://git.dxod.org/explore/repos
</a>.
</p>
<p className="text-muted-foreground leading-relaxed">
We believe that decentralized finance should be verifiable and permissionless from the ground up.
By open-sourcing our smart contracts, math models, and protocol components, we empower developers, researchers, and liquidity providers to audit, extend, and innovate on top of Liquidity Party.
</p>
<p className="text-muted-foreground leading-relaxed font-medium">
Contributions, audits, and discussions are welcome join the party and help shape the future of multi-asset liquidity.
</p>
</Card>
{/* Footer */}
<div className="text-center py-8 border-t">
<p className="text-sm text-muted-foreground">
Ready to experience the future of decentralized trading?
</p>
</div>
</div>
);
}

View File

@@ -6,6 +6,7 @@ import { Button } from '@/components/ui/button';
import { LanguageSelector } from '@/components/language-selector';
import { Moon, Sun } from 'lucide-react';
import { useEffect, useState } from 'react';
import Link from 'next/link';
export function Header() {
const { theme, setTheme } = useTheme();
@@ -29,14 +30,30 @@ export function Header() {
<header className="border-b">
<div className="container mx-auto px-4 py-4 flex items-center justify-between">
<div className="flex items-center gap-2">
<Link href="/">
<img
src={logoSrc}
alt="Liquidity Party"
className="h-8 w-auto"
className="h-8 w-auto cursor-pointer"
/>
</Link>
</div>
<div className="flex items-center gap-2">
{/* Navigation Links */}
<nav className="hidden md:flex items-center gap-1 mr-2">
<Link href="/">
<Button variant="ghost" size="sm" className="text-sm font-medium">
Swap
</Button>
</Link>
<Link href="/about">
<Button variant="ghost" size="sm" className="text-sm font-medium">
About
</Button>
</Link>
</nav>
{/* Language Selector */}
<LanguageSelector />