{% extends 'base.html' %} {% load static %} {% block root %}
<div id="root">
  <div class="row header">
    <div class="col-lg-5 col-md-6 col-sm-12 col-xs-12">
      <a href="{% url 'main:index' %}">
        <img class="header_img" src="{% static 'img/favicon.png' %}" />
        <h1 class="header_title">Hoco Hunt 2021</h1>
      </a>
    </div>
    <div class="col-lg-2 col-md-1"></div>
    <div class="col-lg-5 col-md-5 col-sm-12 col-xs-12 nav_section">
      <div class="dropdown header_nav">
        <button class="btn dropdown-toggle dropdown-btn" data-toggle="dropdown">
          <i class="fas fa-user"></i>
          <span class="caret"></span>
        </button>
        <ul class="dropdown-menu dropdown-menu-right">
          {% if user.is_authenticated %}
          <li><h3 class="drop-item">{{ user.username }}</h3></li>
          <li>
            <a class="drop-item" href="{% url 'main:overview' %}"
              ><h3 class="drop-item">Overview</h3></a
            >
          </li>
          {% if user.is_participant %}
          <li>
            <a class="drop-item" href="{% url 'main:index' %}"
              ><h3 class="drop-item">Challenges</h3></a
            >
          </li>
          {% endif %}
          <li>
            <a class="drop-item" href="{% url 'main:support' %}"
              ><h3 class="drop-item">Support</h3></a
            >
          </li>
          <li>
            <a class="drop-item" href="{% url 'auth:logout' %}"
              ><h3 class="drop-item">Logout</h3></a
            >
          </li>
          {% else %}
          <li>
            <a class="drop-item" href="{% url 'auth:login' %}"
              ><h3 class="drop-item">Login</h3></a
            >
          </li>
          {% endif %}
        </ul>
      </div>
    </div>
  </div>
  <script
    src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
    integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
    crossorigin="anonymous"
  ></script>
  <script
    src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
    integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
    crossorigin="anonymous"
  ></script>
  {% block main %}{% endblock %}
</div>
{% endblock %}