{% extends "admin/_base.html" %}
{% block sidebar %}{% endblock %}
{% block content %}
<div class="rio-login">
<h1 class="rio-login-title">Two-factor authentication</h1>
<p class="rio-login-intro">
Enter the 6-digit code from your authenticator app, or a backup
code in <code>XXXX-XXXX</code> format.
</p>
{% if error %}<div class="rio-flash rio-flash--error" role="alert">{{ error }}</div>{% endif %}
<form method="post" action="/admin/mfa/verify" class="rio-form rio-form--login" autocomplete="off">
<input type="hidden" name="_csrf" value="{{ csrf_token }}">
<div class="rio-form-row">
<label class="rio-label" for="rio-mfa-email">Signed in as</label>
<input
type="email"
id="rio-mfa-email"
value="{{ email }}"
autocomplete="username"
readonly
class="rio-input"
>
</div>
<div class="rio-form-row">
<label class="rio-label" for="rio-mfa-code">Code</label>
<input
type="text"
id="rio-mfa-code"
name="code"
inputmode="text"
autocomplete="one-time-code"
autocapitalize="characters"
autofocus
required
placeholder="123456 or XXXX-XXXX"
class="rio-input"
>
</div>
<button type="submit" class="rio-button rio-button--primary">Verify</button>
</form>
<p class="rio-login-footer">
<a href="/admin/logout">Sign out</a>
</p>
</div>
{% endblock %}