openwemb/templates/signup.html

<%include file="header.inc.html"/>

<div class="box centered">
  <h1 class="title">Sign up</h1>
  <hr>

  <div class="field">
    <label class="label">Username</label>
    <div class="control has-icons-left">
      <input id="username" class="input" type="text" placeholder="e.g. cirno9">
      <span class="icon is-small is-left">
        <i class="fa-solid fa-user"></i>
      </span>
    </div>

    <p id="username_error" class="help is-danger">This username is not valid.</p>   
    <p id="username_taken_error" class="help is-danger">This username is already taken.</p>   
  </div>

  <div class="field">
    <label class="label">Password</label>
    <div class="control has-icons-left">
      <input id="password" class="input" type="password" placeholder="********">
      <span class="icon is-small is-left">
        <i class="fas fa-lock"></i>
      </span>
    </div>   

    <p id="password_error" class="help is-danger">This password is not valid.</p>   

    <div class="control">
      <label class="checkbox">
        <input id="show_password" type="checkbox" onclick="toggle_password_visibility();">
        Show password.
      </label>
    </div>
  </div>

  <div class="field">
    <div class="control">
      <div id="h-captcha" class="h-captcha" data-sitekey="${hcaptcha_sitekey}"></div>
    </div>

    <p id="captcha_error" class="help is-danger">Please, confirm the captcha.</p>
  </div>

  <div class="field">
    <div class="control">
      <button id="signup_button" class="button is-primary">Sign up</button>
    </div>
  </div>
</form>

<script src="/static/js/signup.js"></script>

<%include file="footer.inc.html"/>