ebd5b8ffe6
Drives and folders can be shown as icons (pictures preview themselves), a compact list, or a details table with type and date, remembered per page. Per-item actions move into a ⋯ menu so rows fit a narrow panel. In the 400 px Theseus sidebar the navigation folds into a compact bar with the page name, the s3d status and a menu button, so the page gets the room. The Widen button is gone: widening squeezed the open tab and the right sidebar. Full page opens Pithos as an ordinary tab instead.
53 lines
2.1 KiB
HTML
53 lines
2.1 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Pithos</title>
|
|
<link rel="icon" href="icon.svg" type="image/svg+xml">
|
|
<link rel="stylesheet" href="app.css">
|
|
</head>
|
|
<body>
|
|
<div id="signin" class="signin" hidden>
|
|
<form class="card signin-card" id="signin-form">
|
|
<img src="icon.svg" alt="" width="48" height="48">
|
|
<h1>Pithos</h1>
|
|
<p class="muted" id="signin-hint">Enter the console password.</p>
|
|
<input type="password" id="signin-password" autocomplete="current-password" placeholder="Password" required>
|
|
<button class="btn primary" type="submit">Sign in</button>
|
|
<p class="error" id="signin-error" hidden></p>
|
|
</form>
|
|
</div>
|
|
|
|
<div id="locked" class="signin" hidden>
|
|
<div class="card signin-card">
|
|
<img src="icon.svg" alt="" width="48" height="48">
|
|
<h1>Pithos is locked</h1>
|
|
<p class="muted">Unlock your Theseus vault with your PIN or master password to open Pithos.</p>
|
|
<button class="btn primary" type="button" id="unlock-btn">Unlock</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="app" class="app" hidden>
|
|
<aside class="sidebar">
|
|
<div class="brand"><img src="icon.svg" alt="" width="28" height="28"><span>Pithos</span><span class="here" id="here"></span></div>
|
|
<nav id="nav">
|
|
<a href="#/start" data-view="start">Get started</a>
|
|
<a href="#/overview" data-view="overview">Overview</a>
|
|
<a href="#/buckets" data-view="buckets">Drives</a>
|
|
<a href="#/users" data-view="users">Users & keys</a>
|
|
<a href="#/setup" data-view="setup">Sia connection</a>
|
|
<a href="#/settings" data-view="settings">Settings</a>
|
|
<a href="#/logs" data-view="logs">Logs</a>
|
|
</nav>
|
|
<div class="daemon-pill" id="daemon-pill"><span class="dot"></span><span class="label">…</span></div>
|
|
<button class="nav-toggle" id="nav-toggle" type="button" aria-label="Menu" aria-expanded="false" aria-controls="nav">☰</button>
|
|
</aside>
|
|
<main id="main"></main>
|
|
</div>
|
|
|
|
<div id="modal-root"></div>
|
|
<div id="toasts" class="toasts" aria-live="polite"></div>
|
|
<script type="module" src="app.js"></script>
|
|
</body>
|
|
</html>
|