{% extends "phoxtail_core/modal_drawer.html" %}
{% comment %}
The token just created, in place of the Create drawer: a dialog in the
center, closed only by its buttons, so a stray click cannot lose the raw
token, shown this once (the response carries no-store headers; it is never
kept). Its one button copies the token and closes; a copy that fails leaves
it open. The close button leaves without copying.
{% endcomment %}
{% load i18n phoxtail_core_tags phoxtail_design_tags %}
{% block side %}center{% endblock %}
{% block dismiss %}button{% endblock %}
{% block title %}{{ token.name }}{% endblock %}
{% block body %}
    <div class="phx-card">
        <h3 class="phx-card__title">
            {% icon "warning" %}
            {% translate "Copy your token" %}
        </h3>
        <p class="phx-card__text">{% translate "You won't be able to see it again." %}</p>
        {% field "input" form.token copy=True show_label=True %}
    </div>
{% endblock %}
{% block footer %}
    <button type="button"
            class="phx-button phx-button--primary"
            onclick="navigator.clipboard.writeText(document.getElementById('{{ form.token.id_for_label }}').value).then(() => closeModal(this))">
        <span>{% translate "Copy and close" %}</span>
    </button>
{% endblock %}