site: Anthemus opens as a landing + sub-nav floats free (no box)
- /anthemus/index.html was a 41-line meta-refresh redirect to the
wallet kiosk that never got the wallet up, so Anthemus tab appeared
broken. Replace it with the full landing content (previously only
reachable at /anthemus/about/), with ../ paths adjusted for the new
depth. The nav aria-current now sits on /anthemus/ itself.
- shared-header.css: drop body { padding-right: 200px } so the
sub-nav never shifts main-page body text. Strip the sub-nav
background / border / border-radius / box-shadow on both the
desktop right-side rail and the mobile top-band — links float
directly on the dark sky. Mobile keeps a soft blur-only backdrop
so links stay readable when content scrolls under them.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
parent
8c214c89cb
commit
3fddd71acc
2 changed files with 301 additions and 44 deletions
|
|
@ -3,39 +3,298 @@
|
|||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Anthemus DEX</title>
|
||||
<meta name="description" content="Anthemus — a decentralized exchange on Bitcoin Cash. Order book + AMM over one covenant engine. Trade EUR / USD, BCH / USD, ASM / ASM2 with a taker fee, deposit any stablecoin from any chain into unified USD.">
|
||||
<meta property="og:title" content="Anthemus DEX">
|
||||
<meta property="og:description" content="A decentralized exchange on Bitcoin Cash — order book + AMM over one covenant engine.">
|
||||
<link rel="icon" href="../favicon.ico">
|
||||
<!-- Redirect immediately to the wallet build in DEX-only kiosk mode. The
|
||||
wallet's index.html detects ?kiosk=anthemus and renders just the
|
||||
Exchange — no wallet chrome. Server-side we set canonical to keep
|
||||
search engines pointed here. -->
|
||||
<meta http-equiv="refresh" content="0; url=../wallet/?kiosk=anthemus">
|
||||
<link rel="canonical" href="https://silentmode.st/deviant/anthemus/">
|
||||
<script>
|
||||
(function () {
|
||||
try { location.replace('../wallet/?kiosk=anthemus'); } catch (e) {}
|
||||
})();
|
||||
</script>
|
||||
<title>Anthemus — Decentralized Exchange</title>
|
||||
<meta name="description" content="Anthemus — a decentralized exchange on Bitcoin Cash. Order book + AMM over one engine, plus a Deposit rail into unified USD.">
|
||||
<base href="./">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Ubuntu:wght@300;400;500;700&family=Fraunces:opsz,wght@9..144,300;9..144,400;9..144,500;9..144,600&family=DM+Sans:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="../cosmo-genesis.css">
|
||||
<link rel="stylesheet" href="../shared-theme.css">
|
||||
<link rel="stylesheet" href="../shared-header.css">
|
||||
<style>
|
||||
html, body { height: 100%; margin: 0; background: #060b12; color: #e8ecf5;
|
||||
font-family: 'JetBrains Mono', ui-monospace, monospace; }
|
||||
.anx-fallback { position: fixed; inset: 0; display: flex; flex-direction: column;
|
||||
align-items: center; justify-content: center; padding: 24px; gap: 12px; text-align: center; }
|
||||
.anx-fallback a { color: #b8ff2e; }
|
||||
:root { --maxw: 1180px; --gutter: 40px; }
|
||||
body { overflow-x: hidden; }
|
||||
.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 var(--gutter); position: relative; z-index: 1; }
|
||||
section { position: relative; z-index: 1; }
|
||||
|
||||
.hero { padding: 32px 0 72px; text-align: center; }
|
||||
.eyebrow { display: inline-flex; align-items: center; gap: 9px; font-family: 'JetBrains Mono', monospace; font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--acid); border: 1px solid rgba(214,255,61,.35); border-radius: 100px; padding: 7px 15px; margin-bottom: 30px; }
|
||||
.eyebrow .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--acid); box-shadow: 0 0 8px var(--acid-glow); }
|
||||
h1.hero-title { font-family: 'Fraunces', serif; font-weight: 400; font-size: clamp(38px, 6vw, 84px); line-height: 1.05; letter-spacing: -.02em; color: var(--ink-bright); margin: 0 auto 24px; max-width: 22ch; }
|
||||
h1.hero-title .glow { color: var(--acid); text-shadow: 0 0 10px var(--acid-glow), 0 0 34px var(--acid-halo); }
|
||||
h1.hero-title .glow-blue { color: #2f7fe0; text-shadow: 0 0 10px rgba(47,127,224,.6), 0 0 34px rgba(47,127,224,.34); }
|
||||
.hero-canonical { font-family: 'DM Sans', sans-serif; font-weight: 600; font-size: 15px; letter-spacing: 3px; text-transform: uppercase; color: var(--acid); margin: 0 0 22px; }
|
||||
.hero-sub { font-family: 'Fraunces', serif; font-weight: 300; font-style: italic; font-size: clamp(20px, 2.4vw, 28px); line-height: 1.5; color: var(--ink-soft); max-width: 62ch; margin: 0 auto 40px; }
|
||||
.hero-cta { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }
|
||||
.btn-lg { font-family: 'JetBrains Mono', monospace; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; padding: 16px 30px; border-radius: 12px; cursor: pointer; transition: transform .3s ease, box-shadow .3s; text-decoration: none; display: inline-block; }
|
||||
.btn-lg.primary { color: var(--sky-deep); background: var(--acid); border: 0; box-shadow: 0 0 22px var(--acid-halo); font-weight: 600; }
|
||||
.btn-lg.primary:hover { transform: translateY(-3px); box-shadow: 0 0 32px var(--acid-glow); }
|
||||
.btn-lg.ghost { color: var(--ink-bright); background: transparent; border: 1px solid var(--border-strong, rgba(255,255,255,0.12)); }
|
||||
.btn-lg.ghost:hover { border-color: rgba(214,255,61,.5); color: var(--acid); }
|
||||
|
||||
/* Trading-floor hero visual — three columns hinting at book depth. */
|
||||
.book { position: relative; width: min(560px, 84vw); margin: 56px auto 0; padding: 24px; background: linear-gradient(180deg, rgba(19,26,42,0.55), rgba(10,15,28,0.55)); border: 1px solid var(--border); border-radius: 18px; text-align: left; }
|
||||
.book-head { display: flex; justify-content: space-between; font-family: 'JetBrains Mono', monospace; font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted); margin-bottom: 12px; }
|
||||
.book-rows { display: flex; flex-direction: column; gap: 4px; }
|
||||
.brow { display: grid; grid-template-columns: 60px 1fr 80px; align-items: center; gap: 10px; font-family: 'JetBrains Mono', monospace; font-size: 12px; padding: 3px 0; }
|
||||
.brow .p { color: var(--ink-bright); }
|
||||
.brow .bar { height: 6px; border-radius: 3px; }
|
||||
.brow.ask .bar { background: linear-gradient(90deg, rgba(255,80,80,0.6), rgba(255,80,80,0.2)); }
|
||||
.brow.bid .bar { background: linear-gradient(270deg, rgba(214,255,61,0.6), rgba(214,255,61,0.2)); }
|
||||
.brow .q { color: var(--muted); text-align: right; }
|
||||
.book-spread { text-align: center; padding: 10px 0; margin: 8px 0; border-top: 1px dashed var(--border); border-bottom: 1px dashed var(--border); font-family: 'JetBrains Mono', monospace; font-size: 11px; color: var(--acid); }
|
||||
|
||||
.sec { padding: 84px 0; border-top: 1px solid var(--border); }
|
||||
.sec-h { font-family: 'Fraunces', serif; font-weight: 400; font-size: clamp(28px, 3.6vw, 44px); line-height: 1.1; letter-spacing: -.015em; color: var(--ink-bright); max-width: 24ch; margin-bottom: 18px; }
|
||||
.sec-lead { font-family: 'Fraunces', serif; font-weight: 300; font-size: 18px; line-height: 1.6; color: var(--ink-soft); max-width: 62ch; }
|
||||
.sec-lead em { color: var(--acid); font-style: italic; }
|
||||
.sec-lead strong { color: var(--ink-bright); }
|
||||
.sec-label { margin-bottom: 16px; }
|
||||
|
||||
/* Interface trio — Swap / Exchange / Deposit — each a real card. */
|
||||
.interfaces { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 48px; }
|
||||
.interface { background: var(--surface-1, rgba(19,26,42,0.5)); border: 1px solid var(--border); border-radius: 18px; padding: 30px 26px; transition: border-color .3s, transform .3s ease; }
|
||||
.interface:hover { border-color: rgba(214,255,61,.3); transform: translateY(-4px); }
|
||||
.interface .ico { font-family: 'JetBrains Mono', monospace; font-size: 22px; color: var(--acid); margin-bottom: 18px; text-shadow: 0 0 10px var(--acid-halo); }
|
||||
.interface h3 { font-family: 'Fraunces', serif; font-weight: 500; font-size: 21px; color: var(--ink-bright); margin: 0 0 10px; }
|
||||
.interface p { font-family: 'Fraunces', serif; font-weight: 300; font-size: 15px; line-height: 1.6; color: var(--ink-soft); margin: 0; }
|
||||
.interface p em { color: var(--acid); font-style: italic; }
|
||||
.interface .tag { display: inline-block; margin-top: 14px; font-family: 'JetBrains Mono', monospace; font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); padding: 4px 10px; border: 1px solid var(--border); border-radius: 100px; }
|
||||
|
||||
/* Two-column explainers */
|
||||
.two { display: grid; grid-template-columns: 1fr 1fr; gap: 42px; margin-top: 44px; }
|
||||
.two-card { background: var(--surface-1, rgba(19,26,42,0.5)); border: 1px solid var(--border); border-radius: 18px; padding: 30px 28px; }
|
||||
.two-card h4 { font-family: 'Fraunces', serif; font-weight: 500; font-size: 22px; color: var(--ink-bright); margin: 0 0 12px; }
|
||||
.two-card p { font-family: 'Fraunces', serif; font-weight: 300; font-size: 15.5px; line-height: 1.6; color: var(--ink-soft); margin: 0 0 10px; }
|
||||
.two-card .strong { color: var(--ink-bright); }
|
||||
.two-card .badge { font-family: 'JetBrains Mono', monospace; font-size: 11px; color: var(--acid); letter-spacing: 0.14em; text-transform: uppercase; }
|
||||
|
||||
/* Chain-row: shows all chains that feed the Deposit rail */
|
||||
.chains { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 44px; }
|
||||
.chip { padding: 8px 14px; font-family: 'JetBrains Mono', monospace; font-size: 12px; color: var(--ink-soft); background: var(--surface-1, rgba(19,26,42,0.5)); border: 1px solid var(--border); border-radius: 100px; }
|
||||
.chip .dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--acid); margin-right: 8px; vertical-align: middle; box-shadow: 0 0 6px var(--acid-halo); }
|
||||
|
||||
/* Under Agora — sibling callout */
|
||||
.siblings { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 44px; }
|
||||
.sibling { display: block; background: var(--surface-1, rgba(19,26,42,0.5)); border: 1px solid var(--border); border-radius: 15px; padding: 26px 24px; text-decoration: none; color: inherit; transition: border-color .3s, transform .2s ease; }
|
||||
.sibling:hover { border-color: rgba(214,255,61,.35); transform: translateY(-2px); }
|
||||
.sibling .s-name { font-family: 'Fraunces', serif; font-weight: 500; font-size: 24px; color: var(--ink-bright); margin: 0 0 6px; letter-spacing: -.02em; }
|
||||
.sibling .s-sub { font-family: 'DM Sans', sans-serif; font-weight: 600; font-size: 12px; letter-spacing: 3px; text-transform: uppercase; color: var(--acid); margin: 0 0 12px; }
|
||||
.sibling p { font-family: 'Fraunces', serif; font-weight: 300; font-size: 14.5px; line-height: 1.55; color: var(--ink-soft); margin: 0; }
|
||||
|
||||
.cta-band { text-align: center; padding: 96px 0; border-top: 1px solid var(--border); }
|
||||
.cta-band h2 { font-family: 'Fraunces', serif; font-weight: 400; font-size: clamp(30px, 4.4vw, 54px); color: var(--ink-bright); letter-spacing: -.02em; margin: 0 0 18px; }
|
||||
.cta-band p { font-family: 'Fraunces', serif; font-weight: 300; font-size: 18px; color: var(--ink-soft); max-width: 52ch; margin: 0 auto 36px; }
|
||||
|
||||
.page-footer { border-top: 1px solid var(--border); padding: 44px 0; margin-top: 0; }
|
||||
.foot-in { max-width: var(--maxw); margin: 0 auto; padding: 0 var(--gutter); display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 20px; }
|
||||
.foot-links { display: flex; gap: 26px; font-family: 'JetBrains Mono', monospace; font-size: 12px; }
|
||||
.foot-links a { color: var(--ink-soft); text-decoration: none; }
|
||||
.foot-links a:hover { color: var(--acid); }
|
||||
.foot-note { font-family: 'JetBrains Mono', monospace; font-size: 11px; color: var(--muted); }
|
||||
|
||||
@media (max-width: 900px) {
|
||||
:root { --gutter: 22px; }
|
||||
.interfaces, .two, .siblings { grid-template-columns: 1fr; }
|
||||
.hero { padding: 64px 0 56px; }
|
||||
.sec { padding: 60px 0; }
|
||||
}
|
||||
@media (max-width: 560px) {
|
||||
.hero-cta { flex-direction: column; }
|
||||
.btn-lg { width: 100%; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="anx-fallback">
|
||||
<div>Loading Anthemus DEX…</div>
|
||||
<div style="opacity:.55; font-size:13px;">
|
||||
If nothing happens, <a href="../wallet/?kiosk=anthemus">tap here</a>.
|
||||
</div>
|
||||
<div style="opacity:.45; font-size:11px;">
|
||||
<a href="./about/">About</a>
|
||||
<div class="site-header">
|
||||
<div class="topbar">
|
||||
<a href="/" class="wordmark">Deviant</a>
|
||||
<div class="topbar-right">
|
||||
<nav class="nav" aria-label="Primary">
|
||||
<a href="/artemision/">Artemision</a>
|
||||
<a href="/katalogos/">Katalogos</a>
|
||||
<a href="/potidaea/">Potidaea</a>
|
||||
<a href="/anthemus/" aria-current="page">Anthemus</a>
|
||||
<a href="https://navigate.st/bns/potidaea.asm/app.html">Wallet</a>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<nav class="sub-nav" aria-label="Anthemus sections">
|
||||
<div class="sub-nav-in">
|
||||
<a class="sub-nav-cta" href="https://navigate.st/bns/potidaea.asm/app.html">Launch app →</a>
|
||||
<div class="sub-nav-links">
|
||||
<a href="#what">What it is</a>
|
||||
<a href="#interfaces">Interfaces</a>
|
||||
<a href="#unified-usd">Unified USD</a>
|
||||
<a href="#under-agora">Under Agora</a>
|
||||
</div>
|
||||
<a class="sub-nav-top" href="#top" aria-label="Back to top">↑</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<section class="hero" id="top">
|
||||
<div class="wrap">
|
||||
<h1 class="hero-title"><span class="glow">Anthemus</span></h1>
|
||||
<p class="hero-sub">
|
||||
Decentralized exchange on Bitcoin Cash — order book plus AMM over one engine.
|
||||
Nostro Vostro transactions in unified USD. The venue where the market <em>emerges</em>.
|
||||
</p>
|
||||
<div class="hero-cta">
|
||||
<a class="btn-lg primary" href="https://navigate.st/bns/potidaea.asm/app.html">Launch Anthemus →</a>
|
||||
<a class="btn-lg ghost" href="#interfaces">See the interfaces</a>
|
||||
</div>
|
||||
|
||||
<div class="book" aria-hidden="true">
|
||||
<div class="book-head"><span>EUR / USD</span><span>·</span><span>0.5% slip</span></div>
|
||||
<div class="book-rows">
|
||||
<div class="brow ask"><span class="p">1.0904</span><div class="bar" style="width:38%"></div><span class="q">12,400</span></div>
|
||||
<div class="brow ask"><span class="p">1.0902</span><div class="bar" style="width:56%"></div><span class="q">28,150</span></div>
|
||||
<div class="brow ask"><span class="p">1.0900</span><div class="bar" style="width:78%"></div><span class="q">61,020</span></div>
|
||||
</div>
|
||||
<div class="book-spread">↕ spread 0.0001 · mid 1.0899</div>
|
||||
<div class="book-rows">
|
||||
<div class="brow bid"><span class="p">1.0898</span><div class="bar" style="width:82%"></div><span class="q">72,900</span></div>
|
||||
<div class="brow bid"><span class="p">1.0896</span><div class="bar" style="width:48%"></div><span class="q">24,300</span></div>
|
||||
<div class="brow bid"><span class="p">1.0894</span><div class="bar" style="width:30%"></div><span class="q">9,150</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="sec" id="what">
|
||||
<div class="wrap">
|
||||
<div class="sec-label">The venue</div>
|
||||
<div class="sec-h">Two interfaces, one engine.</div>
|
||||
<p class="sec-lead">
|
||||
<strong>Swap</strong> automates order-making — you pick a pair and an amount; the AMM is a
|
||||
maker on the same book. <strong>Exchange</strong> is the pro grid — chart, book, order form —
|
||||
for anyone who wants control. Both hit the same liquidity. There is no separate "AMM pool"
|
||||
living in isolation.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="sec" id="interfaces">
|
||||
<div class="wrap">
|
||||
<div class="sec-label">— The Anthemus interface</div>
|
||||
<div class="sec-h">Swap · Exchange · Deposit.</div>
|
||||
<div class="interfaces">
|
||||
<div class="interface">
|
||||
<div class="ico">⇅</div>
|
||||
<h3>Swap</h3>
|
||||
<p>One-click trade against pooled liquidity — the AMM is a maker on the book, so a market swap always fills. Price impact and curve fee <em>disclosed separately</em>, never folded into "rate".</p>
|
||||
<span class="tag">Curve fee 0.30% → LPs</span>
|
||||
</div>
|
||||
<div class="interface">
|
||||
<div class="ico">▤</div>
|
||||
<h3>Exchange</h3>
|
||||
<p>Pro grid — chart on the left, book and order form on the right. Limit orders, historical fills, full-depth market data. For anyone who wants to name their price.</p>
|
||||
<span class="tag">Order-book + limit</span>
|
||||
</div>
|
||||
<div class="interface">
|
||||
<div class="ico">↓</div>
|
||||
<h3>Deposit</h3>
|
||||
<p>Bring assets in from Ethereum, Tron, Solana, Bitcoin — the correspondent locks on the source chain and mints on BCH. What lands is <em>unified USD</em> on Bitcoin Cash. One balance, one currency.</p>
|
||||
<span class="tag">Cross-chain rail</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="sec" id="unified-usd">
|
||||
<div class="wrap">
|
||||
<div class="sec-label">Unified USD · no stablecoin pair matrix</div>
|
||||
<div class="sec-h">One dollar, from every chain.</div>
|
||||
<p class="sec-lead">
|
||||
Stablecoins are not <em>traded</em> here. USDT · USDC · PYUSD from any supported chain enter
|
||||
through the Deposit rail and become one <strong>unified USD</strong> on Bitcoin Cash. The
|
||||
pair matrix collapses: instead of USDT/USDC/PYUSD/EURT/EURC/… pairs, Anthemus lists
|
||||
<strong>USD-denominated pairs only</strong> — EUR/USD, BCH/USD, and so on.
|
||||
</p>
|
||||
<div class="two">
|
||||
<div class="two-card">
|
||||
<div class="badge">The old way</div>
|
||||
<h4>N × N stablecoin pairs</h4>
|
||||
<p>Every DEX today lists USDT/USDC, USDT/DAI, USDC/PYUSD, etc. — thin books, drifting pegs, curve fees on <em>every</em> swap between them. Users pay to correct the pool's opinion of "one dollar".</p>
|
||||
</div>
|
||||
<div class="two-card">
|
||||
<div class="badge">Anthemus</div>
|
||||
<h4>One USD, N sources</h4>
|
||||
<p>Deposit resolves the "which stablecoin" question <span class="strong">at ingest</span>. On the trading floor, you hold USD. Pairs are asset/USD, EUR/USD, BCH/USD — no cross-stable churn.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="chains">
|
||||
<span class="chip"><span class="dot"></span>Bitcoin Cash · native</span>
|
||||
<span class="chip"><span class="dot"></span>Ethereum · USDT · USDC · PYUSD</span>
|
||||
<span class="chip"><span class="dot"></span>Tron · USDT</span>
|
||||
<span class="chip"><span class="dot"></span>Solana · USDC · USDT</span>
|
||||
<span class="chip"><span class="dot"></span>Bitcoin · BTC via HTLC</span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="sec" id="under-agora">
|
||||
<div class="wrap">
|
||||
<div class="sec-label">— Under Agora</div>
|
||||
<div class="sec-h">The trading floor. Not the only floor.</div>
|
||||
<p class="sec-lead">
|
||||
Anthemus is one of the two markets Agora holds. The other is <strong>Potidaea</strong> — a
|
||||
counterparty-free automated swap mechanism for backed assets, priced by the covenant itself.
|
||||
Different engines, complementary asset classes.
|
||||
</p>
|
||||
<div class="siblings">
|
||||
<a class="sibling" href="/potidaea/">
|
||||
<div class="s-sub">Counterparty-free ASM</div>
|
||||
<div class="s-name">Potidaea</div>
|
||||
<p>Swaps priced by the mechanism — the Universal Exchange Rate, fixed by consensus. No pool, no oracle, no counterparty. For backed assets (MBAs) where the covenant can price the swap alone.</p>
|
||||
</a>
|
||||
<a class="sibling" href="/agora/">
|
||||
<div class="s-sub">The market hub</div>
|
||||
<div class="s-name">Agora</div>
|
||||
<p>The hub that holds both markets. Read why they coexist — the split between covenant-priced and participant-priced, and which assets live on which floor.</p>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="cta-band">
|
||||
<div class="wrap">
|
||||
<h2>Trade what a mechanism can't price.</h2>
|
||||
<p>Order book, AMM, cross-chain deposit — one venue. Unified USD as the settlement currency, backed by the BCH base layer.</p>
|
||||
<div class="hero-cta">
|
||||
<a class="btn-lg primary" href="https://navigate.st/bns/potidaea.asm/app.html">Launch Anthemus →</a>
|
||||
<a class="btn-lg ghost" href="#top">Back to top</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<footer class="page-footer">
|
||||
<div class="foot-in">
|
||||
<div class="foot-note">Anthemus · Decentralized Exchange on Bitcoin Cash · chipnet beta</div>
|
||||
<div class="foot-links">
|
||||
<a href="#interfaces">Interfaces</a>
|
||||
<a href="#unified-usd">Unified USD</a>
|
||||
<a href="#under-agora">Under Agora</a>
|
||||
<a href="https://navigate.st/bns/potidaea.asm/app.html">Wallet</a>
|
||||
<a href="/brand/">Brand</a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script>
|
||||
document.querySelectorAll('a[href^="#"]').forEach(function(a){
|
||||
a.addEventListener('click', function(e){
|
||||
var id = a.getAttribute('href');
|
||||
if (id.length > 1) {
|
||||
var t = document.querySelector(id);
|
||||
if (t) { e.preventDefault(); t.scrollIntoView({ behavior: 'smooth' }); }
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<script src="/starfield.js" defer></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -8,12 +8,9 @@
|
|||
|
||||
body { padding-top: 58px; } /* clear the fixed header */
|
||||
|
||||
/* Desktop: reserve the right gutter for the vertical sub-nav rail so it
|
||||
never overlaps hero / body content. Kept in sync with the .sub-nav
|
||||
breakpoint below (matches its 900px flip to a horizontal top-band). */
|
||||
@media (min-width: 901px) {
|
||||
body { padding-right: 200px; }
|
||||
}
|
||||
/* The sub-nav floats free — no background, no reserved gutter. Body
|
||||
stays center-anchored and the nav links overlay the right edge
|
||||
without shifting any content. */
|
||||
|
||||
.site-header {
|
||||
position: fixed; top: 0; left: 0; right: 0; width: 100%; z-index: 100;
|
||||
|
|
@ -100,13 +97,11 @@ body { padding-top: 58px; } /* clear the fixed header */
|
|||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
z-index: 90;
|
||||
background: rgba(5, 5, 5, 0.72);
|
||||
backdrop-filter: blur(12px) saturate(120%);
|
||||
-webkit-backdrop-filter: blur(12px) saturate(120%);
|
||||
border: 1px solid rgba(255, 255, 255, 0.06);
|
||||
border-radius: 14px;
|
||||
padding: 10px;
|
||||
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.35);
|
||||
/* Floating free — no background, no border, no box-shadow. The links
|
||||
and CTA sit directly on the dark sky. */
|
||||
background: transparent;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.sub-nav .sub-nav-in {
|
||||
display: flex; flex-direction: column;
|
||||
|
|
@ -188,10 +183,13 @@ body { padding-top: 58px; } /* clear the fixed header */
|
|||
transform: none;
|
||||
border-radius: 0;
|
||||
border: 0;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.06);
|
||||
padding: 10px 16px;
|
||||
padding: 8px 16px;
|
||||
box-shadow: none;
|
||||
background: rgba(5, 5, 5, 0.9);
|
||||
/* Floating free on mobile too — just a soft blur so links stay
|
||||
readable when content scrolls under them, no solid box. */
|
||||
background: transparent;
|
||||
backdrop-filter: blur(6px);
|
||||
-webkit-backdrop-filter: blur(6px);
|
||||
}
|
||||
.sub-nav .sub-nav-in {
|
||||
flex-direction: row;
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue