Fancier UI around OTP codes

This commit is contained in:
Mouse Reeve 2022-11-19 09:48:44 -08:00 committed by GitHub
parent 170aa7460a
commit e11811d461
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -46,7 +46,29 @@
<div class="columns"> <div class="columns">
<section class="column is-narrow"> <section class="column is-narrow">
<figure class="m-4">{{ qrcode | safe }}</figure> <figure class="m-4">{{ qrcode | safe }}</figure>
<div> {{ code | safe }} </div> <details class="details-panel box">
<summary>
<span role="heading" aria-level="3" class="title is-6">
{% trans "Use setup key" %}
<span class="details-close icon icon-x" aria-hidden="true"></span>
</span>
</summary>
<dl class="block">
<dt class="has-text-weight-bold mr-5 is-pulled-left">
{% trans "Account name:" %}
</dt>
<dd>
<code>{{ user.username }}</code>
</dd>
<dt class="has-text-weight-bold mr-5 is-pulled-left">
{% trans "Code:" %}
</dt>
<dd>
<code>{{ code | safe }}</code>
</dd>
</dl>
</details>
<div class="field"> <div class="field">
<label class="label" for="id_otp">{% trans "Enter the code from your app:" %}</label> <label class="label" for="id_otp">{% trans "Enter the code from your app:" %}</label>
{{ form.otp }} {{ form.otp }}