SHiNE-server/SHiNE-browser-plugin-wallet/popup.html

77 lines
3.4 KiB
HTML

<!doctype html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>SHiNE Wallet</title>
<link rel="stylesheet" href="./popup.css" />
</head>
<body>
<main class="layout">
<section class="panel">
<div class="panel-header">
<div>
<h1>SHiNE Wallet</h1>
<p class="muted">Session-only wallet plugin</p>
</div>
<span id="connection-pill" class="pill pill-offline">offline</span>
</div>
<label class="field">
<span>Логин сервера SHiNE</span>
<input id="server-url" type="text" placeholder="shineupme" />
</label>
<p id="server-address" class="muted small">Текущий адрес: https://shineup.me</p>
<div id="session-card" class="card hidden">
<div class="card-title">Подключённая wallet-session</div>
<div class="summary-row"><span>Логин</span><strong id="session-login"></strong></div>
<div class="summary-row"><span>Session ID</span><code id="session-id"></code></div>
<div class="summary-row"><span>Тип</span><strong id="session-type">wallet</strong></div>
<div class="actions">
<button id="resume-btn" class="btn secondary" type="button">Переподключить</button>
<button id="disconnect-btn" class="btn danger" type="button">Отключить</button>
</div>
</div>
<div class="card">
<div class="card-title">Войти через другое устройство</div>
<label class="field">
<span>Логин</span>
<input id="login-input" type="text" autocomplete="username" />
</label>
<label class="checkbox-row">
<input id="use-password" type="checkbox" />
<span>Использовать доп. пароль</span>
</label>
<label id="password-field" class="field hidden">
<span>Пароль подключения</span>
<input id="password-input" type="password" autocomplete="current-password" />
</label>
<button id="start-btn" class="btn primary" type="button">Получить код</button>
<p class="muted small">
Wallet plugin создаёт временный requester keypair, ждёт подтверждение на доверенном устройстве
и получает только wallet-session без передачи постоянных ключей.
</p>
</div>
<div id="pairing-card" class="card hidden">
<div class="card-title">Код подключения</div>
<div id="short-code" class="code">0000000</div>
<p id="pairing-hint" class="muted small">
Покажите код на доверенном устройстве в разделе «Подключить по коду».
</p>
<p id="pairing-expire" class="muted small"></p>
<div class="actions">
<button id="cancel-btn" class="btn secondary" type="button">Отменить</button>
</div>
</div>
<div id="status" class="status hidden"></div>
</section>
</main>
<script type="module" src="./popup.js"></script>
</body>
</html>