c6eb0b1927
Reworked the login page - Simplified some of the HTML and CSS - Removed some `aria-label`s - Added alt text for the logo - Added a label for the input field - Added subtle borders to otherwise flat elements  Reviewed-on: https://codeberg.org/superseriousbusiness/masto-fe-standalone/pulls/76 Co-authored-by: Zoë Bijl <code@moiety.me> Co-committed-by: Zoë Bijl <code@moiety.me>
46 lines
1.7 KiB
HTML
46 lines
1.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Login | Masto-FE (🦥 flavour)</title>
|
|
<meta content="width=device-width, initial-scale=1" name="viewport">
|
|
<link rel="stylesheet" media="all" href="/packs/css/flavours/glitch/login.css" />
|
|
<script src="/auth.js"></script>
|
|
</head>
|
|
|
|
<body class="app-body">
|
|
<div class="login-container">
|
|
<header>
|
|
<img alt="a friendly smiling sloth" src="images/mascot.svg" />
|
|
</header>
|
|
<main>
|
|
<h1>Log into your instance</h1>
|
|
<form method="post" id="login">
|
|
<label for="instance">Instance URL</label>
|
|
<input type="text" id="instance" value="" class="input instance">
|
|
<button type="submit" class="button" id="btn">
|
|
<span id="message">Authorize</span>
|
|
</button>
|
|
</form>
|
|
<aside class="content">
|
|
<p>
|
|
<strong>Note:</strong>
|
|
this application is completely client-side, meaning everything happens in the browser on your machine.
|
|
It does not store information anywhere else than your browser's local storage.
|
|
</p>
|
|
</aside>
|
|
</main>
|
|
<footer class="link-footer">
|
|
<p>
|
|
<strong>Masto-FE (🦥 flavour)</strong>
|
|
<span aria-hidden="true"> · </span>
|
|
<a href="https://codeberg.org/superseriousbusiness/masto-fe-standalone" rel="noopener noreferrer" target="_blank">
|
|
Source code
|
|
</a>
|
|
</p>
|
|
</footer>
|
|
</div>
|
|
</body>
|
|
|
|
</html> |