{% extends "base.tera.html" %}
{% import "inputs.tera.html" as inputs %}

{% block title %}
Login
{% endblock title %}

{% block content %}
<div class="grow sm:flex justify-center items-center">
    <div class="border-2 border-zinc-300 sm:rounded-2xl lg:rounded-4xl my-2 px-20 pb-14 pt-10 sm:shadow-lg space-y-4">
        <h1 class="font-bold text-3xl">Login</h1>
        <form action="/login" method="POST" class="space-y-4">
            {{ inputs::text_input(label="Username", name="username", id="username") }}
            {{ inputs::text_input(label="Password", name="password", id="password", type="password") }}
            <div class="flex flex-col">
                <button type="submit" class="bg-blue-500 p-2 rounded-lg text-white">
                    Login
                </button>
            </div>
            <div class="flex flex-col">
                <a href="/register" class="bg-zinc-500 p-2 rounded-lg text-white text-center">
                    Register
                </a>
            </div>
        </form>
    </div>
</div>
{% endblock content %}