secure-login-one
Version:
A secure login where the user's private key is never hosted on servers or the user's online devices ( this project can also be used as a form of two-factor authentication ( 2FA ) where the user's private key is never hosted on servers )
66 lines (65 loc) • 2.4 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="author" content="Harmotus">
<meta name="robots" content="noindex, nofollow">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="../images/favicon.svg">
<title>Table</title>
<style>
*{border:0;margin:0;padding:0;outline:0;font-size:16px;line-height:1.2;list-style:none;text-decoration:none;box-sizing:border-box;font-family:Arial,Helvetica,sans-serif}
body{color:#fff;background-color:#313e4e;font-family:Arial,Helvetica,sans-serif}
span{height:3.12em;width:100%;color:#fff;padding:.9em 0;font-size:1.2rem;max-width:9.8615em;margin-bottom:.21em;display:inline-block;text-decoration:none;background-color:#313e4e;border:1px solid #b7baae}
div.max{color:#fff;display:flex;height:100vh;align-items:center;flex-direction:column;justify-content:center;background-color:#313e4e}
div.one{width:100%;max-width:60em;margin-top:-1.8em}
div.two{margin-top:0;text-align:center}
.a3, .a4, .a5, .a6 {width:100%;max-width:7em;}
.a2{width:100%;max-width:9.81em;}
.a1{width:100%;max-width:4em;}
.ay {background-color:#455554}
.an {background-color:#a13249}
.at {background-color:#313e4e}
.ah {background-color:#313e4e}
.ad {background-color:#313e4e}
</style>
</head>
<body>
<div class="max">
<div class="one">
<div class="two">
<span class="a1 at">#</span>
<span class="a2 at">All Devices</span>
<span class="a3 at">Online</span>
<span class="a4 at">Private Key</span>
<span class="a5 at">Public Key</span>
<span class="a6 at">Webcam</span>
</div>
<div class="two">
<span class="a1 ah">S1</span>
<span class="a2 ad">Client Server 1</span>
<span class="a3 ay">Yes</span>
<span class="a4 an">No</span>
<span class="a5 ay">Yes</span>
<span class="a6 an">No</span>
</div>
<div class="two">
<span class="a1 ah">D1</span>
<span class="a2 ad">User Device 1</span>
<span class="a3 ay">Yes</span>
<span class="a4 an">No</span>
<span class="a5 an">No</span>
<span class="a6 an">No</span>
</div>
<div class="two">
<span class="a1 ah">D2</span>
<span class="a2 ad">User Device 2</span>
<span class="a3 an">No</span>
<span class="a4 ay">Yes</span>
<span class="a5 an">No</span>
<span class="a6 ay">Yes</span>
</div>
</div>
</div>
</body>
</html>