{% extends 'base.html.twig' %}

{% block title %}Rat der Götter{% endblock %}

{% block content %}
    <div class="w-100 h-100">
        <div class="card bg-primary text-light bg-opacity-75 position-absolute top-50 start-50 translate-middle">
            <div class="card-header p-4">
                <h3>Einloggen</h3>
                <p>Logge dich mit deinem Benutzernamen und deinem Passwort ein.</p>
            </div>
            <div class="card-body p-4">
                <form method="post" action="/">
                    {% if error %}
                        <div class="alert alert-danger">{{ error.messageKey|trans(error.messageData, 'security') }}</div>
                    {% endif %}

                    <label for="inputUsername">Benutzername</label>
                    <input type="text" value="{{ last_username }}" name="username" id="inputUsername"
                           class="form-control mb-3" required autofocus>
                    <label for="inputPassword">Passwort</label>
                    <input type="password" name="password" id="inputPassword" class="form-control mb-3" required>

                    <input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}">

                    <button class="btn btn-secondary p-3" type="submit">
                        Anmelden
                    </button>
                </form>
            </div>
        </div>
    </div>
{% endblock %}