{% trans_default_domain 'portal_engine_frontend' %}

{% extends "@PimcorePortalEngine/layout/login.html.twig" %}

{% block navbar %}
{% endblock %}

{% block footer %}
{% endblock %}

{% block content %}
    <style>
        .login__content {
            padding: 1rem 5.625rem 1rem;
        }
    </style>
    <div class="login">
        {% block login_background %}
            <div class="login__bg" style="background-image: url('{{ portalEngine_images_background() }}')"></div>
        {% endblock %}

        {% block login_content %}
            <div class="login__content">
                {% block logo %}
                    <img class="img-fluid" src="{{ portalEngine_images_logo(constant('Pimcore\\Bundle\\PortalEngineBundle\\Enum\\ImageThumbnails::LOGO')) }}">
                {% endblock %}

                {% block form %}
                    <div class="mt-5">
                        <div class="form-group">
                            <img src="{{ image }}"/>
                            <p>Please scan the QR-Code and add it to your any Authenticator app.</p>
                        </div>

                        <div class="form-group">
                            <form method="post" action="">
                                <button type="submit" class="btn btn-block btn-primary text-uppercase">Click here to verify</button>
                            </form>
                        </div>

                        <a id="portal_logout" href="/auth/logout">Back to Login</a>
                    </div>
                {% endblock %}
            </div>
        {% endblock %}
    </div>
{% endblock %}