{% extends "base.html" %}

{% block wrapper %}
    <div class="login-box">
        <div class="card card-outline card-primary">
            <div class="card-header text-center">
                <a href="/" class="h1"><b>Cat&aacute;logo</b> V1</a>
            </div>
            <div class="card-body">
                <p class="login-box-msg">Ingresa tus credenciales</p>

                <form id="login" onsubmit="event.preventDefault(); $('#submit').click();" method="POST">
                    <div class="input-group mb-3">
                        <input type="email" name="email" class="form-control" placeholder="Correo" required>
                        <div class="input-group-append">
                            <div class="input-group-text">
                                <span class="fas fa-envelope"></span>
                            </div>
                        </div>
                    </div>
                    <div class="input-group mb-3">
                        <input type="password" name="password" class="form-control" placeholder="Contrase&ntilde;a" required>
                        <div class="input-group-append">
                            <div class="input-group-text">
                                <span class="fas fa-lock"></span>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-12">
                            <div class="icheck-primary">
                                <input type="checkbox" id="remember" name="remember">
                                <label for="remember">
                                    Recu&eacute;rdame
                                </label>
                            </div>
                        </div>
                        <div class="col-12 mt-3">
                            <button id="submit" type="button" class="btn btn-primary btn-block">Ingresar</button>
                        </div>
                    </div>
                </form>

                <p class="mt-2 mb-1">
                    <a href="#"><small>He olvidado mi contrase&ntilde;a</small></a>
                </p>
            </div>
        </div>
    </div>
{% endblock %}

{% block footer %}

{% endblock %}

{% block javascript %}
    {{ parent() }}

    <script>App.Jaxon.User.init();</script>
{% endblock %}