153 lines
3.9 KiB
HTML
153 lines
3.9 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(--g4);
|
|
}
|
|
</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>
|