70 lines
2.8 KiB
HTML
70 lines
2.8 KiB
HTML
|
<!doctype html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8" />
|
||
|
|
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
||
|
|
<title>Import Contractless Wallet</title>
|
||
|
|
<link rel="stylesheet" href="./import-wallet.css" />
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<header class="site-header">
|
||
|
|
<div class="brand">
|
||
|
|
<img src="./assets/contractless-logo.png" alt="" />
|
||
|
|
<div><strong>Contractless</strong><span>Browser Wallet</span></div>
|
||
|
|
</div>
|
||
|
|
<span class="local-page">Local extension page</span>
|
||
|
|
</header>
|
||
|
|
|
||
|
|
<main>
|
||
|
|
<section id="import-panel" class="import-panel">
|
||
|
|
<span class="eyebrow">Restore <span id="selected-network">Contractless</span> wallet</span>
|
||
|
|
<h1>Import wallet image</h1>
|
||
|
|
<p class="intro">
|
||
|
|
Select your encrypted Contractless private-key image and enter the
|
||
|
|
encryption key originally used to create it.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<form id="import-form">
|
||
|
|
<label class="file-picker" for="wallet-image">
|
||
|
|
<span class="file-icon">+</span>
|
||
|
|
<span>
|
||
|
|
<strong id="image-file-name">Choose wallet image</strong>
|
||
|
|
<small>PNG encrypted private-key image</small>
|
||
|
|
</span>
|
||
|
|
</label>
|
||
|
|
<input id="wallet-image" class="visually-hidden" type="file" accept="image/png" required />
|
||
|
|
|
||
|
|
<label for="image-password">Encryption key</label>
|
||
|
|
<div class="input-row">
|
||
|
|
<input id="image-password" type="password" autocomplete="current-password" required />
|
||
|
|
<button id="reveal-password" type="button">Show</button>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="security-note">
|
||
|
|
<strong>Processed locally by Contractless Wallet</strong>
|
||
|
|
<span>The wallet image and encryption key are not sent to the website you were visiting.</span>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<button id="import-button" class="primary" type="submit">Import wallet</button>
|
||
|
|
<p id="notice" role="alert" aria-live="polite"></p>
|
||
|
|
</form>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<section id="success-panel" class="success-panel" hidden>
|
||
|
|
<span class="success-mark" aria-hidden="true">✓</span>
|
||
|
|
<span class="eyebrow">Import complete</span>
|
||
|
|
<h1>Wallet imported successfully</h1>
|
||
|
|
<p>The imported wallet is unlocked and is now the active Contractless address.</p>
|
||
|
|
<div class="address-result">
|
||
|
|
<span>Active wallet</span>
|
||
|
|
<strong id="imported-address"></strong>
|
||
|
|
</div>
|
||
|
|
<p class="completion-message">You may close this page and reopen the Contractless Wallet extension.</p>
|
||
|
|
<button id="close-page" class="primary" type="button">Close page</button>
|
||
|
|
</section>
|
||
|
|
</main>
|
||
|
|
|
||
|
|
<script type="module" src="./import-wallet.ts"></script>
|
||
|
|
</body>
|
||
|
|
</html>
|