Files
Vanillae/jrx/pages/popup.html
T

165 lines
4.1 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<style type="text/css">
@import "gaju-colors.css";
body {
background: var(--b1);
color: --var(g8);
width: 400px;
font-family: monospace, sans-serif;
font-size: 0.7em;
}
#jr-hdr {
border: 2px solid var(--g4);
border-radius: 5px;
width: 100%;
background: var(--g2);
}
.psection {
background: var(--b2);
border: 1px solid var(--g4);
border-radius: 5px;
width: 97%;
padding: 5px;
margin-top: 5px;
}
.account-active {
background: var(--g1);
color: var(--g7);
}
.account-inactive {
background: var(--b4);
color: var(--b7);
}
.balance-found {
color: var(--g5);
}
.balance-not-found {
color: var(--b7);
}
a {
color: var(--g5);
}
</style>
</head>
<body>
<table id="jr-hdr">
<tr>
<td><img src="../art/jrx-icon-48.png" style="width: 32px; height: 32px;"></td>
<td style="font-size: 32px; text-align: center; font-weight: bold">
GAJUMARU WALLET
</td>
</tr>
</table>
<div class="psection">
<table >
<tr>
<td><img src="../art/keypair.svg" style="width: 32px; height: 32px;"></td>
<td style="justify-content: center; font-size: 28px; text-align: center; font-weight: bold">
ACCOUNTS
</td>
</tr>
</table>
<!-- hidden if there are keypairs -->
<!-- hidden by default -->
<p id="no-keypairs" hidden>
No keypairs yet. Either generate one or recover one below using a
GajuPhrase.
</p>
<!-- keypairs added dynamically from page script -->
<ul id="keypairs"></ul>
</div>
<!-- generate new keypair -->
<div class="psection">
<table >
<tr>
<td><img src="../art/keypair.svg" style="width: 32px; height: 32px;"></td>
<td style="justify-content: center; font-size: 28px; text-align: center; font-weight: bold">
GENERATE NEW KEYPAIR
</td>
</tr>
</table>
<form>
<label for="generate-name">Name:</label>
<input id="generate-name" value="default1"></input>
<br>
<button id="generate-btn">Generate New Keypair</button>
</form>
</div>
<!-- faert recovery -->
<div class="psection">
<table >
<tr>
<td><img src="../art/keypair.svg" style="width: 32px; height: 32px;"></td>
<td style="justify-content: center; font-size: 28px; text-align: center; font-weight: bold">
RECOVER KEYPAIR FROM GajuPhrase
</td>
</tr>
</table>
<!-- recover from faert phrase -->
<form>
<label for="faert-name">Name:</label>
<input id="faert-name"></input>
<br>
<label for="faert-input">GajuPhrase:</label>
<input id="faert-input"></input>
<br>
<button id="faert-btn">Recover Keypair from GajuPhrase</button>
</form>
</div>
<!-- network id -->
<div class="psection">
<table >
<tr>
<td><img src="../art/keypair.svg" style="width: 32px; height: 32px;"></td>
<td style="justify-content: center; font-size: 28px; text-align: center; font-weight: bold">
NETWORK ID
</td>
</tr>
</table>
<form id='netids'></form>
</div>
<pre id="scratch"></pre>
<!--
<div style="margin-top: 5px; width: 95%; background: #d9ffd6; border: 1px solid #6c5d96; border-radius: 5px;">
<table>
<tr>
<td><img src="../art/keypair.svg" style="width: 32px; height: 32px;"></td>
<td style="justify-content: center; font-size: 28px; text-align: center; font-weight: bold">
KEYPAIRS
</td>
</tr>
</table>
</div>
-->
<script type="module" src="../dist/popup.js"></script>
</body>
</html>