<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Log in</title>
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
        <link rel="stylesheet" href="{{ url_for('static',filename='css/style.css') }}">
    </head>
    <body class="container">
        <div class="col-md-6 offset-md-3">
            <h1>Login</h1>
            {% with messages = get_flashed_messages(with_categories=true) %}
              {% if messages %}
                {% for category, message in messages %}
                  <div class="alert alert-{{ category }}" role="alert">{{ message }}</div>
                {% endfor %}
              {% endif %}
            {% endwith %}

            <form action="/login" method="post">
                <div class="form-group">
                <input type="text" name="username" class="form-control" placeholder="Pseudo">
                <input type="password" name="password" class="form-control" placeholder="Password">
                <button type="submit" class="btn btn-primary">Submit</button>
                </div>
            </form>
        </div>
    </body>
</html>