Auction/auctions/templates/auctions/layout.html

{% load static %}

<!DOCTYPE html>
<html lang="en">
    <head>
        <a href="index.html"><title>{% block title %}Auctions{% endblock %}</title></a>
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">

    </head>
    <body style="padding: 10px">
        <a href="{% url 'index' %}" style = "color:inherit;text-decoration: none;"><h1>Auctions</h1></a>
        <div class = "text-right" style = "align-self: flex-end;">
            {% if user.is_authenticated %}
                Signed in as <strong>{{ user.username }}</strong>.
            {% else %}
                Not signed in.
            {% endif %}
        </div>
        <nav class="navbar navbar-expand-md navbar-light bg-light">
            
              <ul class="navbar-nav mr-auto">
                <li class="nav-item active">
                    <a class="nav-link" href="{% url 'index' %}">Active Listings <span class="sr-only">(current)</span></a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="{% url 'all_listings' %}">All Listings</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="{% url 'categories' %}">Categories</a>
                </li>
                {% if user.is_authenticated %}
                <li class="nav-item">
                    <a class="nav-link" href="{% url 'watchlist' %}">WatchList <span class="badge badge-secondary">{{ user.watchlist.count }}</span></a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="{% url 'create' %}">Create Listing</a>
                </li>
                {% endif %}
                </ul>
                <ul class="navbar-nav">

                {% if not user.is_authenticated %}
                    <li class="nav-item">
                        <a class="nav-link" href="{% url 'login'%}">Login</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="{% url 'register' %}">Register</a>
                    </li>
                 {% else %}   
                    <li class="nav-item">
                        <a class="nav-link" href="{% url 'logout' %}">Logout</a>
                    </li>
                {% endif %}

                </ul>
                
          </nav>
        <hr>
        {% block body %}
        {% endblock %}
    </body>
</html>