{% from "bootstrap5/form.html" import render_form %}
{% block content %}
{% include "header.html" %}

<!-- Page Header -->
<header
  class="masthead"
  style="background-image: url('../static/assets/img/login-bg.jpg')"
>
  <div class="container position-relative px-4 px-lg-5">
    <div class="row gx-4 gx-lg-5 justify-content-center">
      <div class="col-md-10 col-lg-8 col-xl-7">
        <div class="page-heading">
          <h1>Log In</h1>
          <span class="subheading">Welcome Back!</span>
        </div>
      </div>
    </div>
  </div>
</header>

<main class="mb-4">
  <div class="container">
    <div class="row">
      <!-- Adding Flash message here for users trying to register twice -->
      {% with messages = get_flashed_messages() %}
      {% if messages %}
      {% for message in messages %}
      <p class="flash">{{ message }}</p>
      {% endfor %}
      {% endif %}
      {% endwith %}
      <div class="col-lg-8 col-md-10 mx-auto">
        <!--Rendering login form here-->
        {{render_form(form, novalidate=True, button_map={"submit": "primary"}) }}
      </div>
    </div>
  </div>
</main>


{% include "footer.html" %} {% endblock %}
