synapse-registration/index.html

100 lines
No EOL
4.1 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<!-- Meta tags -->
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
<meta name="viewport" content="width=device-width" />
<!-- Favicon and title -->
<link rel="icon" href="path/to/fav.png">
<title>matrix.lila.network - Registration</title>
<!-- Halfmoon CSS -->
<link href="/static/halfmoon-variables.min.css" rel="stylesheet" />
</head>
<body data-set-preferred-mode-onload="true">
<!-- Modals go here -->
<!-- Reference: https://www.gethalfmoon.com/docs/modal -->
<!-- Page wrapper start -->
<div class="page-wrapper">
<!-- Sticky alerts (toasts), empty container -->
<!-- Reference: https://www.gethalfmoon.com/docs/sticky-alerts-toasts -->
<div class="sticky-alerts"></div>
<!-- Content wrapper start -->
<div class="content-wrapper">
<div class="container-fluid"></div>
<div class="content">
<h1>Registration for matrix.lila.network 💜</h1>
</div>
<div class="card">
<h2 class="card-title align-middle">
Registration details
</h2>
<form action="javascript: submitForm();" class="w-600 mw-full align-middle">
<!-- w-400 = width: 40rem (400px), mw-full = max-width: 100% -->
<!-- Username -->
<div class="form-group">
<label for="username" class="required">Username</label>
<input type="text" class="form-control" id="username" placeholder="Username"
required="required">
</div>
<!-- Display Name -->
<div class="form-group">
<label for="displayname" class="required">Display Name</label>
<input type="text" class="form-control" id="displayname" placeholder="Display Name"
required="required">
</div>
<!-- Password -->
<div class="form-group">
<label for="password" class="required">Password</label>
<input type="password" class="form-control" id="password" placeholder="*******"
required="required" oninput="HandlePasswordInput();">
<label for="password-repeat" class="required">Repeat Password</label>
<input type="password" class="form-control" id="password-repeat" placeholder="*******"
required="required" oninput="HandlePasswordInput();">
</div>
<div id="password-info" class="alert alert-danger" role="alert" style="margin-bottom: 15px; display: none;">
</div>
<!-- Shared Secret -->
<div class="form-group">
<label for="sharedsecret" class="required">Shared Secret</label>
<input type="password" class="form-control" id="sharedsecret" placeholder="secret"
required="required">
</div>
<!-- Submit button -->
<input id="submit-button" class="btn btn-primary" type="submit" value="Register">
</form>
</div>
</div>
<!--
Add your page's main content here
Examples:
1. https://www.gethalfmoon.com/docs/content-and-cards/#building-a-page
2. https://www.gethalfmoon.com/docs/grid-system/#building-a-dashboard
-->
</div>
<!-- Content wrapper end -->
</div>
<!-- Page wrapper end -->
<!-- Halfmoon JS -->
<script src="/static/halfmoon.min.js" defer></script>
<script src="/static/script.js" defer></script>
<script src="/static/sha1.js" defer></script>
</body>
</html>