{% load static %}
{% load i18n %}
{% load l10n %}
{% load mastodon %}
{% load thumb %}
<!DOCTYPE html>
<html lang="zh">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{{ site_name }}</title>
    {% include "common_libs.html" %}
  </head>
  <body>
    {% include "_header.html" %}
    <main class="container">
      <article>
        <header>
          <h3>{% trans "Verification email is being sent, please check your inbox." %}</h3>
        </header>
        {% trans "Please enter the verification code you received." %}
        <style type="text/css">
          .otp input {
            font-family: monospace;
            font-weight: bolder;
            letter-spacing: 2em;
            text-align: center;
          }
        </style>
        <form action="{% url 'mastodon:email_verify' %}" method="post">
          <div class="otp">
            <input name="code"
                   maxlength="5"
                   value=""
                   autocomplete="one-time-code"
                   autocapitalize="none"
                   autocorrect="off"
                   required
                   pattern="^[a-zA-Z0-9]{5}$" />
            <small>{{ error }}</small>
          </div>
          <input type="submit" value="Submit" />
          {% csrf_token %}
        </form>
      </article>
    </main>
    {% include "_footer.html" %}
  </body>
</html>
