{% extends 'base.html' %}
{% block content%}

<div class="container">
    <div class="row justify-content-center">
      <div class="col-md-6 mt-5">
        <div class="card">
          <div class="card-header bg-primary text-white">Login</div>
          <div class="card-body">
            {% if user.is_authenticated %}
                <meta http-equiv="refresh" content="0; url={% url 'dashboard' %}" /> 
            {% else %}
            <form method="post" action="{% url 'login' %}">
              {% csrf_token %}
              <div class="mb-3">
                <label for="id_username" class="form-label">Username</label>
                <input type="text" name="username" id="id_username" placeholder="Username" class="form-control" required>
              </div>
              <div class="mb-3">
                <label for="id_password" class="form-label">Password</label>
                <input type="password" name="password" id="id_password" placeholder="Password" class="form-control" required>
                <input type="checkbox" onclick="showPassword()"> Show Password
                <br>
              </div>
              <button type="submit" class="btn btn-primary" role="button">Login</button>
            </form>
            {% endif %}
          </div>
        </div>
      </div>
    </div>
</div>

<script>
  function showPassword() {
      var passwordInput = document.getElementById('id_password');
      if (passwordInput.type === 'password') {
          passwordInput.type = 'text';
      } else {
          passwordInput.type = 'password';
      }
  }
</script>


{% endblock content%}

