{% extends "core/frontend/index.jinja" %}
{% block content %}
<style>
    .form-signin input[type="text"] {
        margin-bottom: -1px;
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
    }

    .form-signin input[type="password"] {
        margin-bottom: 10px;
        border-top-left-radius: 0;
        border-top-right-radius: 0;
    }
</style>
<div class="row justify-content-md-center form-signin">
    <div class="col col-lg-4">
        <form id="login" action="/gate/gate.login" method="post">
            <h1 class="h3 mb-3 fw-normal">Login</h1>

            {% include "core/frontend/widgets/err_banner.jinja" %}

            <div class="form-floating">
                <input form="login" class="form-control" name="access-code" id="access-code" type="text"
                    placeholder="00000000000000000000" maxlength="20" required>
                <label for="access-code">Access Code</label>
            </div>
            <div class="form-floating">
                <input form="login" type="password" class="form-control" name="passwd" id="passwd" placeholder="Password">
                <label for="passwd">Password</label>
            </div>
            
            <!--
            <div class="form-check text-start my-3">
                <input class="form-check-input" type="checkbox" value="remember-me" id="remember-me">
                <label class="form-check-label" for="remember-me">
                    Remember me
                </label>
            </div>
            -->

            <div class="alert alert-info" role="alert">
                To register for the WebUI, type in the <strong>access code</strong> of your card, as shown in a game, and leave the
                password field blank.
            </div>

            <button class="btn btn-primary w-100 py-2" type="submit">Sign in</button>
            <!-- <p class="mt-5 mb-3 text-body-secondary">© 2023 ARTEMiS</p>-->
        </form>
    </div>
</div>
{% endblock content %}