<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>{% block title %}Tayapromediverse{% endblock %}</title>
    {% load static %}

    <!-- Main CSS file -->
    <link rel="stylesheet" href="{% static 'css/style.css' %}" />

    <!-- Toastify CSS -->
    <link
      rel="stylesheet"
      type="text/css"
      href="https://cdn.jsdelivr.net/npm/toastify-js/src/toastify.min.css"
    />

    {% block extra_head %}{% endblock %}
  </head>
  <body>
    <nav>
      <a href="{% url 'home' %}">Home</a>
      <a href="{% url 'signup' %}">Signup</a>
      <a href="{% url 'login' %}">Login</a>
      {% if user.is_authenticated %}
      <a href="{% url 'logout' %}">Logout</a>
      {% endif %}
    </nav>
    <hr />

    {% block content %}{% endblock %}

    <!-- Toastify JS -->
    <script
      type="text/javascript"
      src="https://cdn.jsdelivr.net/npm/toastify-js"
    ></script>

    <!-- Toastify Utils -->
    <script src="{% static 'js/toastify-utils.js' %}"></script>

    <!-- Django Messages with Toastify -->
    {% if messages %}
    <div id="django-messages" style="display: none">
      {% for message in messages %}
      <div
        data-type="{{ message.tags }}"
        data-message="{{ message|escapejs }}"
      ></div>
      {% endfor %}
    </div>
    {% endif %} {% block extra_scripts %}{% endblock %}
  </body>
</html>
