{% extends 'base.html' %}

{% block content %}

      <!-- SECTION: Content Block 1 -->
      <section
        class="w-full py-8 bg-gray-900 text-white "
      >
        <div class="mx-auto w-3/4 flex flex-col items-center">
          <h1
            class="text-3xl text-center lg:text-left lg:text-5xl mb-4 lg:mb-16"
          >
          Bon retour par minou
          </h1>
       </div>
       <div class="flex flex-col justify-center items-center md:p-8 mx-auto w-full bg-gray-900 text-gray-800">
       {% for message in get_flashed_messages() %}
             <div class="pt-2 px-24 h-11 mb-10 ring ring-transparent text-xl justify-center mx-auto rounded-md text-red-100 bg-red-500">{{ message }}</div>
       {% endfor %}
        <form action=""  method="post" class="grid grid-cols-1 gap-6 w-3/1">
              <label class="block">
                <span class="text-white">Login</span>
                <input type="text" name="login" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50" placeholder="" value="{{ request.form['login'] }}">
              </label>
              <label class="block">
                <span class="text-white">Password</span>
                <input type="password" name="password" class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50" placeholder="">
              </label>
              <button class="px-6 h-16 hover:bg-red-600 bg-red-500 focus:ring-red-300 text-white ring ring-transparent text-xl shadow-md rounded-md uppercase font-semibold focus:outline-none" type="submit">
                  Login
              </button>
            
       </form>
       <a class="pt-2 text-gray-300" href="/register">No account ? Register</a>
       </div>
       </section>
{% endblock %}