{% extends "meta.html" %}
{% block title %}
<title>配置 TOTP 验证 - {{cfg("sr.ht", "site-name")}} meta</title>
{% endblock %}
{% block content %}
<div class="row">
  <section class="col-md-8 offset-md-2">
    <h3>启用 TOTP 验证</h3>
    <p>
      使用
      <a
        href="https://f-droid.org/en/packages/com.beemdevelopment.aegis/"
        target="_blank"
      >Aegis</a> 等应用扫描下方二维码，然后输入生成的验证码以启用 TOTP。
    </p>
    <div class="col-md-12 text-centered">
      <img src="{{qrcode}}" alt="{{secret}}" title="{{otpauth_uri}}"/><br>
      <a href="{{otpauth_uri}}"><small>{{otpauth_uri}}</small></a>
    </div>
    <form method="POST" action="/security/totp/enable">
      {{csrf_token()}}
      <input type="hidden" name="secret" value="{{secret}}" />
      <div class="form-group">
        <input
          type="number"
          id="code"
          name="code"
          class="form-control {{valid.cls("code")}}"
          placeholder="123456"
          required
          autocomplete="one-time-code"
          autofocus />
        {{valid.summary("code")}}
      </div>
      <button type="submit" class="btn btn-primary pull-right">
        启用 {{icon("caret-right")}}
      </button>
    </form>
  </section>
</div>
{% endblock %}