{% extends '@Login/loginLayout.twig' %}

{% set title %}{{ 'Login_ConfirmPasswordToContinue'|translate }}{% endset %}

{% block loginContent %}
    <div class="contentForm loginForm confirmPasswordForm">
        {% embed 'contentBlock.twig' with {'title': ('Login_ConfirmPasswordReset'|translate)} %}
        {% block content %}
            <p>{{ 'Login_ConfirmPasswordResetIntro'|translate }}</p>

            <div class="message_container">
                {% if errorMessage is not empty %}
                    <div vue-entry="CoreHome.Notification"
                         noclear="true"
                         context="error">
                        <strong>{{ 'General_Error'|translate }}</strong>: {{ errorMessage }}<br/>
                    </div>
                {% endif %}
            </div>
            <br>

            <form action="{{ linkTo({'module': loginPlugin, 'action': 'confirmResetPassword'}) }}" ng-non-bindable method="post">
                <div class="row">
                    <div class="col s12 input-field">
                        <input type="hidden" name="nonce" value="{{ nonce }}"/>
                        <input type="password" placeholder="" name="mtmpasswordconfirm" id="mtmpasswordconfirm" class="input" value="" size="20"
                               autocorrect="off" autocapitalize="none" spellcheck="false"
                               tabindex="20" />
                        <label for="mtmpasswordconfirm"><i class="icon-locked icon"></i> {{ 'Login_NewPassword'|translate }}</label>
                    </div>
                </div>

                <div class="row actions">
                    <div class="col s12">
                        <input class="submit btn" id='login_reset_confirm' type="submit" value="{{ 'General_Confirm'|translate }}"
                               tabindex="100"/>
                    </div>
                </div>

            </form>
        {% endblock %}
        {% endembed %}
    </div>

{% endblock %}