304 lines
19 KiB
HTML
304 lines
19 KiB
HTML
<!doctype html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<title>Pithos — a control panel for your Sia storage</title>
|
||
<meta name="description" content="Pithos runs s3d, the Sia S3 gateway, for you: connect it to Sia, create S3 users and keys, browse and share buckets, and watch uploads land on the network. In Theseus, on the desktop, or in a browser.">
|
||
<link rel="icon" href="assets/favicon.svg" type="image/svg+xml">
|
||
<meta property="og:type" content="website">
|
||
<meta property="og:site_name" content="pithos.sia">
|
||
<meta property="og:title" content="Pithos — a control panel for your Sia storage">
|
||
<meta property="og:description" content="Run s3d without the command line: Sia connection, S3 users and keys, buckets, live upload pipeline.">
|
||
<meta property="og:image" content="assets/logo.svg">
|
||
<meta name="twitter:card" content="summary">
|
||
<style>
|
||
:root{
|
||
--bg:#0b100e; --panel:#121a17; --panel2:#17211d; --line:rgba(255,255,255,.08);
|
||
--ink:#e6ece9; --mut:#8e9c96; --dim:#5f6b66; --acc:#3ddc97; --acc-deep:#1e9e72;
|
||
--sia:#b39ddb; --warn:#ffc75f;
|
||
}
|
||
*{box-sizing:border-box}
|
||
html{scroll-behavior:smooth}
|
||
body{margin:0;background:radial-gradient(1100px 560px at 50% -12%,#14271f,var(--bg));
|
||
color:var(--ink);font:16px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;min-height:100vh;padding-top:52px}
|
||
a{color:var(--acc)}
|
||
code{font-family:ui-monospace,"Cascadia Mono","SF Mono",Consolas,monospace;font-size:.88em;background:var(--panel2);padding:.12em .4em;border-radius:5px}
|
||
.wrap{max-width:980px;margin:0 auto;padding:0 1.2rem}
|
||
|
||
.topnav{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;gap:2px;align-items:center;
|
||
padding:10px 1.2rem;background:rgba(11,16,14,.88);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
|
||
.topnav .brand{font-weight:600;color:var(--ink);text-decoration:none;margin-right:14px;font-size:15px;display:flex;align-items:center;gap:8px}
|
||
.topnav .brand img{width:20px;height:20px}
|
||
.topnav .brand .g{color:var(--acc)}
|
||
.topnav a{color:var(--mut);text-decoration:none;padding:6px 12px;border-radius:8px;font-size:14px}
|
||
.topnav a:hover{color:var(--ink);background:var(--panel)}
|
||
.topnav a.get{margin-left:auto;background:rgba(61,220,151,.10);color:var(--acc);font-weight:500}
|
||
.topnav a.get:hover{background:rgba(61,220,151,.18)}
|
||
.topnav .menu{display:none}
|
||
@media (max-width:720px){
|
||
.topnav{padding:10px 1rem}
|
||
.topnav > a:not(.brand){display:none}
|
||
.topnav .menu{display:block;margin-left:auto;position:relative}
|
||
.topnav .menu > summary{list-style:none;cursor:pointer;padding:8px 10px;border-radius:8px;color:var(--mut);display:inline-flex}
|
||
.topnav .menu > summary::-webkit-details-marker{display:none}
|
||
.topnav .menu > summary svg{width:22px;height:22px}
|
||
.topnav .menu[open] > summary{color:var(--ink);background:var(--panel)}
|
||
.topnav .menu-panel{position:absolute;top:calc(100% + 6px);right:0;background:var(--bg);border:1px solid var(--line);
|
||
border-radius:12px;padding:6px;min-width:200px;display:flex;flex-direction:column;gap:2px;box-shadow:0 10px 32px rgba(0,0,0,.55)}
|
||
.topnav .menu-panel a{display:block;padding:10px 14px;font-size:14.5px}
|
||
}
|
||
|
||
header.hero{text-align:center;padding:4.5rem 1.2rem 1.5rem}
|
||
header.hero img{width:84px;height:84px;filter:drop-shadow(0 6px 28px rgba(61,220,151,.22))}
|
||
h1{font-size:clamp(2rem,5.5vw,2.9rem);margin:.9rem 0 .3rem;letter-spacing:-.5px}
|
||
h1 .g{color:var(--acc)}
|
||
.tag{color:var(--mut);font-size:1.08rem;max-width:640px;margin:0 auto}
|
||
.cta{margin-top:1.8rem;display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
|
||
.btn{display:inline-flex;align-items:center;gap:8px;padding:.7rem 1.2rem;border-radius:10px;text-decoration:none;font-weight:600;font-size:15px;border:1px solid var(--line);color:var(--ink);background:var(--panel)}
|
||
.btn:hover{background:var(--panel2)}
|
||
.btn.primary{background:var(--acc);border-color:var(--acc);color:#06231a}
|
||
.btn.primary:hover{filter:brightness(1.07);background:var(--acc)}
|
||
|
||
section{padding:3rem 0 1rem}
|
||
section > .wrap > h2{font-size:1.55rem;margin:0 0 .4rem;letter-spacing:-.2px}
|
||
section > .wrap > p.lead{color:var(--mut);margin:0 0 1.6rem;max-width:720px}
|
||
|
||
.shot{margin:2.2rem auto 0;max-width:900px;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--panel);box-shadow:0 30px 80px rgba(0,0,0,.45)}
|
||
.shot .bar{display:flex;gap:6px;padding:10px 12px;border-bottom:1px solid var(--line)}
|
||
.shot .bar i{width:10px;height:10px;border-radius:50%;background:#2a3430}
|
||
.shot .body{display:grid;grid-template-columns:170px 1fr;min-height:300px;text-align:left}
|
||
.shot nav{border-right:1px solid var(--line);padding:14px 10px;display:flex;flex-direction:column;gap:3px;font-size:13px}
|
||
.shot nav span{padding:6px 10px;border-radius:7px;color:var(--mut)}
|
||
.shot nav span.on{background:rgba(61,220,151,.12);color:var(--acc);font-weight:600}
|
||
.shot .main{padding:18px 20px}
|
||
.shot .main h3{margin:0 0 12px;font-size:17px}
|
||
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
|
||
.stat{background:var(--panel2);border-radius:9px;padding:10px 12px}
|
||
.stat b{display:block;font-size:20px;font-variant-numeric:tabular-nums}
|
||
.stat small{color:var(--mut);font-size:12px}
|
||
.pill{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;color:var(--acc);background:rgba(61,220,151,.1);padding:3px 10px;border-radius:999px;margin-bottom:12px}
|
||
.pill::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--acc)}
|
||
@media (max-width:640px){ .shot .body{grid-template-columns:1fr} .shot nav{display:none} .stats{grid-template-columns:repeat(2,1fr)} }
|
||
|
||
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
|
||
.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:1.2rem 1.3rem}
|
||
.card h3{margin:.1rem 0 .4rem;font-size:1.05rem}
|
||
.card p{margin:0;color:var(--mut);font-size:.95rem}
|
||
.card .ic{font-size:1.4rem;line-height:1;margin-bottom:.5rem}
|
||
.card .status{display:inline-block;margin-top:.8rem;font-size:12.5px;padding:2px 9px;border-radius:999px;background:var(--panel2);color:var(--mut)}
|
||
.card .status.ok{background:rgba(61,220,151,.12);color:var(--acc)}
|
||
.card .status.soon{background:rgba(255,199,95,.12);color:var(--warn)}
|
||
|
||
.flow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:10px;margin:1rem 0 .4rem}
|
||
.flow .node{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:1rem;text-align:center}
|
||
.flow .node b{display:block}
|
||
.flow .node small{color:var(--mut)}
|
||
.flow .node.sia{border-color:rgba(179,157,219,.35)}
|
||
.flow .node.sia b{color:var(--sia)}
|
||
.flow .node.s3d b{color:var(--acc)}
|
||
.flow .arr{color:var(--dim);font-size:1.3rem}
|
||
.ctl{margin:6px auto 0;max-width:520px;text-align:center;color:var(--mut);font-size:.93rem;border:1px dashed rgba(61,220,151,.35);border-radius:12px;padding:.7rem 1rem}
|
||
.ctl b{color:var(--acc)}
|
||
@media (max-width:720px){ .flow{grid-template-columns:1fr} .flow .arr{transform:rotate(90deg);text-align:center} }
|
||
|
||
ol.steps{counter-reset:s;list-style:none;padding:0;margin:0;display:grid;gap:12px}
|
||
ol.steps li{counter-increment:s;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:1rem 1.2rem 1rem 3.4rem;position:relative}
|
||
ol.steps li::before{content:counter(s);position:absolute;left:1.1rem;top:1rem;width:1.6rem;height:1.6rem;border-radius:50%;
|
||
background:rgba(61,220,151,.14);color:var(--acc);display:grid;place-items:center;font-weight:700;font-size:.9rem}
|
||
ol.steps li b{display:block;margin-bottom:.15rem}
|
||
ol.steps li span{color:var(--mut);font-size:.95rem}
|
||
pre{background:var(--panel2);border-radius:10px;padding:.8rem 1rem;overflow:auto;font-size:13px;margin:.6rem 0 0}
|
||
pre code{background:none;padding:0}
|
||
|
||
ul.checks{list-style:none;padding:0;margin:0;display:grid;gap:10px}
|
||
ul.checks li{padding-left:1.7rem;position:relative;color:var(--mut)}
|
||
ul.checks li::before{content:"✓";position:absolute;left:0;color:var(--acc);font-weight:700}
|
||
ul.checks li b{color:var(--ink);font-weight:600}
|
||
|
||
details.faq{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:.9rem 1.2rem;margin-bottom:10px}
|
||
details.faq summary{cursor:pointer;font-weight:600}
|
||
details.faq p{color:var(--mut);margin:.6rem 0 0}
|
||
|
||
footer{margin-top:3rem;border-top:1px solid var(--line);padding:2rem 0 3rem;color:var(--dim);font-size:.9rem}
|
||
footer .cols{display:flex;gap:2rem;flex-wrap:wrap;justify-content:space-between}
|
||
footer a{color:var(--mut);text-decoration:none}
|
||
footer a:hover{color:var(--ink)}
|
||
footer ul{list-style:none;padding:0;margin:.4rem 0 0;display:grid;gap:4px}
|
||
footer h4{margin:0;color:var(--ink);font-size:.9rem}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
<nav class="topnav">
|
||
<a class="brand" href="./"><img src="assets/favicon.svg" alt=""><span>pithos<span class="g">.sia</span></span></a>
|
||
<a href="#features">Features</a>
|
||
<a href="#how">How it works</a>
|
||
<a href="#get">Get Pithos</a>
|
||
<a href="#security">Security</a>
|
||
<a href="#faq">FAQ</a>
|
||
<a class="get" href="#get">Get started</a>
|
||
<details class="menu">
|
||
<summary aria-label="Menu"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><path d="M4 7h16M4 12h16M4 17h16"/></svg></summary>
|
||
<div class="menu-panel">
|
||
<a href="#features">Features</a>
|
||
<a href="#how">How it works</a>
|
||
<a href="#get">Get Pithos</a>
|
||
<a href="#security">Security</a>
|
||
<a href="#faq">FAQ</a>
|
||
</div>
|
||
</details>
|
||
</nav>
|
||
|
||
<header class="hero">
|
||
<img src="assets/logo.svg" alt="Pithos">
|
||
<h1>Your own S3, <span class="g">stored on Sia</span></h1>
|
||
<p class="tag">Pithos runs <a href="https://github.com/SiaFoundation/s3d">s3d</a>, the Sia Foundation's S3 gateway, without the command line. Connect it to Sia, hand out access keys, manage buckets and watch your files reach the network.</p>
|
||
<div class="cta">
|
||
<a class="btn primary" href="#get">Get Pithos</a>
|
||
<a class="btn" href="#how">How it works</a>
|
||
</div>
|
||
|
||
<div class="shot" aria-hidden="true">
|
||
<div class="bar"><i></i><i></i><i></i></div>
|
||
<div class="body">
|
||
<nav><span class="on">Overview</span><span>Buckets</span><span>Users & keys</span><span>Sia connection</span><span>Settings</span><span>Logs</span></nav>
|
||
<div class="main">
|
||
<div class="pill">s3d running</div>
|
||
<h3>Upload pipeline</h3>
|
||
<div class="stats">
|
||
<div class="stat"><b>12</b><small>pending · 48 MiB</small></div>
|
||
<div class="stat"><b>3,204</b><small>on Sia · 21.4 GiB</small></div>
|
||
<div class="stat"><b>0</b><small>failed uploads</small></div>
|
||
<div class="stat"><b>2</b><small>awaiting pin</small></div>
|
||
<div class="stat"><b>1</b><small>open multipart</small></div>
|
||
<div class="stat"><b>0</b><small>orphaned</small></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
<section id="features">
|
||
<div class="wrap">
|
||
<h2>Everything s3d does, on one screen</h2>
|
||
<p class="lead">s3d is a great piece of plumbing that you drive with a CLI and config files. Pithos keeps the plumbing and gives you the controls.</p>
|
||
<div class="grid">
|
||
<div class="card"><div class="ic">🔗</div><h3>Connect to Sia</h3><p>Register with sia.storage or your own indexer using your recovery phrase, or generate a new one. You approve the connection in your browser; the phrase never leaves your machine.</p></div>
|
||
<div class="card"><div class="ic">🔑</div><h3>Users & access keys</h3><p>Create a user per app or person. Issue and revoke keys, and copy ready-made config for the aws CLI, rclone or environment variables.</p></div>
|
||
<div class="card"><div class="ic">🗂️</div><h3>Buckets & files</h3><p>Browse any user's buckets, drag files in, download them, delete folders, and make a bucket public-read when you want to serve files.</p></div>
|
||
<div class="card"><div class="ic">📤</div><h3>Share links</h3><p>Signed links that work without a key and expire after an hour, a day or a week.</p></div>
|
||
<div class="card"><div class="ic">📈</div><h3>Upload pipeline</h3><p>See what is still buffered locally, what is already on Sia, and anything that failed. Flush the buffer on demand.</p></div>
|
||
<div class="card"><div class="ic">⚙️</div><h3>Daemon & settings</h3><p>Install the official s3d release with its checksum verified, start and stop it, follow its logs and edit its settings, including redundancy and upload threads.</p></div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="how">
|
||
<div class="wrap">
|
||
<h2>How it works</h2>
|
||
<p class="lead">Your apps talk plain S3. s3d encrypts and erasure-codes the data and spreads it across independent Sia hosts. Pithos sits beside s3d and runs it for you.</p>
|
||
<div class="flow">
|
||
<div class="node"><b>Your apps</b><small>aws, rclone, backups, any S3 SDK</small></div>
|
||
<div class="arr">→</div>
|
||
<div class="node s3d"><b>s3d</b><small>S3 API on your machine · encrypts locally</small></div>
|
||
<div class="arr">→</div>
|
||
<div class="node sia"><b>Sia network</b><small>independent hosts, 3× redundancy by default</small></div>
|
||
</div>
|
||
<div class="ctl"><b>Pithos</b> starts and watches s3d, holds the Sia connection, issues keys and shows you the pipeline.</div>
|
||
<p class="lead" style="margin-top:1.4rem">Files are encrypted before they leave your computer. Sia hosts store pieces they cannot read, and no single host holds enough to rebuild a file.</p>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="get">
|
||
<div class="wrap">
|
||
<h2>Three ways to run it</h2>
|
||
<p class="lead">The same Pithos everywhere: one engine, one interface, three homes.</p>
|
||
<div class="grid">
|
||
<div class="card">
|
||
<div class="ic">🧭</div><h3>In Theseus Navigator</h3>
|
||
<p>Built into the Theseus browser as an extension. Open it from the dock and it runs in a tab. Nothing extra to install.</p>
|
||
<span class="status ok">Built into Theseus 0.3.72</span> <a class="status ok" style="text-decoration:none" href="https://dl.silentmode.st/latest/TheseusNavigator-Setup.exe">Download Theseus</a>
|
||
</div>
|
||
<div class="card">
|
||
<div class="ic">🖥️</div><h3>Desktop app</h3>
|
||
<p>A standalone window for Windows, macOS and Linux. Quitting stops s3d cleanly, so your upload buffer is always flushed to disk.</p>
|
||
<span class="status soon">Installers coming</span>
|
||
</div>
|
||
<div class="card">
|
||
<div class="ic">🌐</div><h3>Web console</h3>
|
||
<p>Run it next to s3d on a server and open it in any browser. Loopback-only by default; password plus a TLS proxy for remote access.</p>
|
||
<span class="status soon">Source release coming</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="start">
|
||
<div class="wrap">
|
||
<h2>From zero to S3 in four steps</h2>
|
||
<p class="lead">You need a <a href="https://sia.storage">sia.storage</a> account (or your own indexer). Pithos walks you through the rest.</p>
|
||
<ol class="steps">
|
||
<li><b>Install s3d</b><span>Pithos downloads the official s3d release from the Sia Foundation and checks its SHA-256 before using it.</span></li>
|
||
<li><b>Connect to Sia</b><span>Enter your recovery phrase or create a new one, then approve the connection on the indexer's page.</span></li>
|
||
<li><b>Create a user</b><span>Pithos makes the first access key with it and shows ready-to-paste client config.</span></li>
|
||
<li><b>Point your tools at it</b><span>Anything that speaks S3 now stores on Sia.</span>
|
||
<pre><code>aws --profile backups --endpoint-url http://127.0.0.1:8000 s3 cp ./photos s3://family/ --recursive</code></pre></li>
|
||
</ol>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="security">
|
||
<div class="wrap">
|
||
<h2>Built to be boring about security</h2>
|
||
<p class="lead">A storage control panel holds the keys to your data, so Pithos is strict by default.</p>
|
||
<ul class="checks">
|
||
<li><b>Your recovery phrase stays local.</b> It goes straight to the s3d process on your machine and is never stored, logged or uploaded.</li>
|
||
<li><b>Loopback only by default.</b> The control panel listens on 127.0.0.1 and rejects requests that arrive under any other host name.</li>
|
||
<li><b>One-time sign-in.</b> Theseus and the desktop app open the panel with a single-use secret that becomes a strict, HttpOnly session cookie.</li>
|
||
<li><b>No cross-site tricks.</b> Every change needs a custom header that other websites cannot send.</li>
|
||
<li><b>Verified downloads.</b> s3d binaries are checked against the Sia Foundation's published SHA-256 before they are installed.</li>
|
||
<li><b>Untrusted files stay inert.</b> Downloads are served sandboxed, so a stored HTML file cannot run inside the panel.</li>
|
||
</ul>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="faq">
|
||
<div class="wrap">
|
||
<h2>Questions</h2>
|
||
<details class="faq"><summary>Is Pithos a storage provider?</summary><p>No. Pithos is a control panel. Your data goes from s3d on your machine straight to Sia hosts, paid through your indexer account. Silent Mode never sees or holds your files.</p></details>
|
||
<details class="faq"><summary>What does it cost?</summary><p>Pithos is free and open source. Storage is billed by your Sia indexer, for example sia.storage.</p></details>
|
||
<details class="faq"><summary>Which s3d version do I need?</summary><p>v0.2.0 or newer. Pithos offers to install the right one for you and tells you when yours is too old.</p></details>
|
||
<details class="faq"><summary>I already run s3d as a service. Can Pithos manage it?</summary><p>Yes. Pithos uses the same config file a hand-run s3d uses. If s3d is already running, Pithos shows it as external, reads its stats and leaves the process alone.</p></details>
|
||
<details class="faq"><summary>Is there a size limit?</summary><p>Uploads from the Pithos window are capped at 5 GiB per file for now. S3 clients such as aws and rclone use multipart uploads and go well beyond that.</p></details>
|
||
<details class="faq"><summary>Why the name?</summary><p>A pithos was the great storage jar of the ancient Greek world, where a household kept what it could not afford to lose.</p></details>
|
||
</div>
|
||
</section>
|
||
|
||
<footer>
|
||
<div class="wrap cols">
|
||
<div>
|
||
<h4>pithos.sia</h4>
|
||
<p style="margin:.4rem 0 0;max-width:320px">A control panel for s3d, the Sia S3 gateway. Part of Silent Mode.</p>
|
||
</div>
|
||
<div>
|
||
<h4>Silent Mode</h4>
|
||
<ul>
|
||
<li><a href="https://silentmode.st/">silentmode.st</a></li>
|
||
<li><a href="https://silentmode.st/theseus">Theseus Navigator</a></li>
|
||
</ul>
|
||
</div>
|
||
<div>
|
||
<h4>Sia</h4>
|
||
<ul>
|
||
<li><a href="https://github.com/SiaFoundation/s3d">s3d on GitHub</a></li>
|
||
<li><a href="https://sia.storage">sia.storage</a></li>
|
||
<li><a href="https://sia.tech">sia.tech</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="wrap" style="margin-top:1.6rem">s3d is MIT-licensed software by the Sia Foundation. Pithos is an independent, MPL-2.0 Silent Mode project and is not made by the Sia Foundation.</div>
|
||
</footer>
|
||
|
||
</body>
|
||
</html>
|