mirror of
https://github.com/status-im/MyCrypto.git
synced 2026-08-31 02:31:13 +00:00
153 lines
3.8 KiB
HTML
153 lines
3.8 KiB
HTML
<html>
|
|
|
|
<head>
|
|
<title>TREZOR - Enter Passphrase </title>
|
|
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'nonce-$scriptNonce'; style-src 'unsafe-inline'">
|
|
</head>
|
|
|
|
<body>
|
|
<!-- TEMPLATE -->
|
|
<h1>Enter your passphrase</h1>
|
|
|
|
<div class="passphrase-controls">
|
|
<input type="password" class="passphrase-input">
|
|
|
|
<button class="passphrase-unlock">
|
|
Unlock
|
|
</button>
|
|
</div>
|
|
|
|
<button class="close">
|
|
<svg viewPort="0 0 12 12" width="12" height="12" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<line x1="1" y1="11" x2="11" y2="1" stroke="white" stroke-width="2" />
|
|
<line x1="1" y1="1" x2="11" y2="11" stroke="white" stroke-width="2" />
|
|
</svg>
|
|
</button>
|
|
|
|
<!-- SCRIPT -->
|
|
<script nonce="$scriptNonce">
|
|
var ipcRenderer = require('electron').ipcRenderer;
|
|
var remote = require('electron').remote;
|
|
var body = document.querySelector('body');
|
|
var input = document.querySelector('.passphrase-input');
|
|
var unlock = document.querySelector('.passphrase-unlock');
|
|
var close = document.querySelector('.close');
|
|
var passphrase = "";
|
|
|
|
function unlockWithPassphrase() {
|
|
ipcRenderer.send('$EVENT', passphrase);
|
|
}
|
|
|
|
body.addEventListener('keydown', function (e) {
|
|
// On enter press,
|
|
if (e.keyCode === 13) {
|
|
unlockWithPassphrase();
|
|
}
|
|
});
|
|
|
|
input.addEventListener('input', function (e) {
|
|
passphrase = e.target.value
|
|
});
|
|
|
|
unlock.addEventListener('click', unlockWithPassphrase);
|
|
|
|
close.addEventListener('click', function () {
|
|
var window = remote.getCurrentWindow();
|
|
window.close();
|
|
});
|
|
</script>
|
|
|
|
<!-- STYLES -->
|
|
<style>
|
|
body {
|
|
color: #FFF;
|
|
padding: 20px;
|
|
margin: 0;
|
|
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
body * {
|
|
box-sizing: inherit;
|
|
}
|
|
|
|
h1,
|
|
h2 {
|
|
text-align: center;
|
|
}
|
|
|
|
h1 {
|
|
font-size: 28px;
|
|
font-weight: 100;
|
|
margin-bottom: 3px;
|
|
letter-spacing: 1.2px;
|
|
}
|
|
|
|
.passphrase-controls {
|
|
position: relative;
|
|
width: 220px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.passphrase-input {
|
|
width: 100%;
|
|
background: none;
|
|
border: none;
|
|
border-bottom: 1px solid #FFF;
|
|
opacity: 0.7;
|
|
font-size: 16px;
|
|
padding: 4px;
|
|
margin-bottom: 10px;
|
|
letter-spacing: 1px;
|
|
color: #FFF;
|
|
margin-top: 5rem;
|
|
}
|
|
|
|
.passphrase-unlock {
|
|
width: 100%;
|
|
padding: 6px;
|
|
opacity: 0.6;
|
|
text-align: center;
|
|
font-size: 10px;
|
|
border: 1px solid #FFF;
|
|
border-radius: 2px;
|
|
text-transform: uppercase;
|
|
letter-spacing: 1.2px;
|
|
}
|
|
|
|
.passphrase-unlock:hover {
|
|
opacity: 0.8;
|
|
}
|
|
|
|
.passphrase-unlock:active {
|
|
opacity: 1;
|
|
}
|
|
|
|
.close {
|
|
position: absolute;
|
|
top: 10px;
|
|
right: 10px;
|
|
width: 14px;
|
|
height: 14px;
|
|
opacity: 0.3;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.close:hover,
|
|
.close:focus {
|
|
opacity: 1;
|
|
}
|
|
|
|
button {
|
|
display: block;
|
|
background: none;
|
|
border: none;
|
|
padding: 0;
|
|
cursor: pointer;
|
|
color: #FFF;
|
|
outline: none;
|
|
}
|
|
</style>
|
|
</body>
|
|
|
|
</html> |