{% extends 'layouts/main.html' %}

{% block content %}
<div class="card bg-light mt-4">
    <h1 class="card-header">Login</h1>
    <div class="card-body column">
        <form method="POST" action="/login">
            <div class="mb-3 row">
                <label for="email" class="col-sm-2 col-form-label">Email</label>
                <div class="col-sm-10">
                    <input type="email" value="{{ email }}" class="form-control {% if errors.get('email') %} is-invalid {% endif %}" id="email" placeholder="email@example.com" name="email">
                    <div class="invalid-feedback">
                        {{ errors.get('email', '') }}
                    </div>
                </div>
            </div>

            <div class="mb-3 row">
                <label for="password" class="col-sm-2 col-form-label">Passwort</label>
                <div class="col-sm-10">
                    <input type="password" value="{{ password }}" class="form-control {% if errors.get('password') %} is-invalid {% endif %}" id="password" name="password">
                    <div class="invalid-feedback">
                        {{ errors.get('password', '') }}
                    </div>
                </div>
            </div>

            <div class="col-auto">
                <button type="submit" class="btn btn-primary mb-3">Login</button>
            </div>
        </form>
    </div>
</div>
{% endblock %}