{{define "register"}}
{{template "header" .}}
<main id="main" class="wrap auth-wrap">
  <p class="eyebrow">New account</p>
  <h1>Create an account</h1>
  {{if .Error}}<p class="banner error" role="alert">{{.Error}}</p>{{end}}
  <form class="ask" method="post" action="/register">
    <input type="hidden" name="_csrf" value="{{.CSRF}}">
    <label for="username">Username</label>
    <input id="username" name="username" type="text" required minlength="3" maxlength="20" pattern="[A-Za-z0-9_]+" autocomplete="username" autocapitalize="off" spellcheck="false" value="{{.Username}}">
    <p class="hint">3–20 letters, numbers, or underscores.</p>
    <label for="password">Password</label>
    <input id="password" name="password" type="password" required minlength="8" maxlength="72" autocomplete="new-password">
    <p class="hint">At least 8 characters (max 72 bytes).</p>
    <label for="setup_secret">Setup secret <span class="hint">(optional, first install only)</span></label>
    <input id="setup_secret" name="setup_secret" type="password" autocomplete="off">
    <p class="hint">Only needed once to create the first admin. Leave blank otherwise.</p>
    <button type="submit" class="btn btn-primary">Create account</button>
  </form>
  <p class="switch">Already have an account? <a href="/login">Sign in</a></p>
</main>
{{template "footer" .}}
{{end}}