{% extends "base" %}

{% block content %}
  <div class="w-full max-w-md space-y-8">
    <div>
      <img class="mx-auto h-16 w-auto" src="https://rudernlinz.at/wp-content/uploads/2021/02/cropped-logo.png" alt="Your Company">
      <h1 class="mt-6 h1">Ruderassistent</h1>
    </div>

    {% if flash %}
      {% if flash.0 == "success" %}
      <div class="bg-[#4ade80] text-white px-3 py-1 rounded-md text-center">
        {{ flash.1 }}
      </div>
      {% endif %}
      {% if flash.0 == "error" %}
      <div class="bg-[#f43f5e] text-white px-3 py-1 rounded-md text-center">
        {{ flash.1 }}
      </div>
      {% endif %}
    {% endif %}
    <form class="mt-8 space-y-6" method="post" action="/auth">
      <input type="hidden" name="remember" value="true">
      <div class="-space-y-px rounded-md shadow-sm">
        <div>
          {{ macros::input(label='Name', name='name', type='input', required=true, class='rounded-t-md') }}
        </div>
        <div>
          {{ macros::input(label='Passwort', name='password', type='password', class='rounded-b-md') }}
        </div>
      </div>

      <div>
        <button type="submit" class="group relative flex w-full justify-center btn btn-primary">
          <span class="absolute inset-y-0 left-0 flex items-center pl-3">
            {% include "includes/lock-icon" %}
          </span>
          Einloggen
        </button>
      </div>
    </form>
  </div>
{% endblock content %}