konova/templates/navbar.html

{% load i18n fontawesome_5 %}
<nav class="navbar navbar-expand-lg navbar-dark">
    <a href="{% url 'home' %}">
        <div class="nav-icon badge mr-5" title="{% trans 'Kompensationsverzeichnis Service Portal' %}">
            <strong class="">{% trans 'KSP' %}</strong>
        </div>
    </a>
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
    </button>
    <div class="collapse navbar-collapse" id="navbarSupportedContent">
        <ul class="navbar-nav mr-auto">
            <li class=" menu-elem">
                <a class="nav-btn nav-link" href="{% url 'home' %}">
                    {% fa5_icon 'home' %}
                    {% trans 'Home' %}
                </a>
            </li>
            <li class=" menu-elem">
                <a class="nav-btn nav-link" href="{% url 'intervention:index' %}">
                    {% fa5_icon 'pencil-ruler' %}
                    {% trans 'Intervention' %}
                </a>
            </li>
            <li class=" menu-elem">
                <a class="nav-btn nav-link" href="{% url 'compensation:index' %}">
                    {% fa5_icon 'leaf' %}
                    {% trans 'Compensation' %}
                </a>
            </li>
            <li class=" menu-elem">
                <a class="nav-btn nav-link" href="{% url 'compensation:account-index' %}">
                    {% fa5_icon 'tree' %}
                    {% trans 'Eco-account' %}
                </a>
            </li>
            <li class=" menu-elem dropdown" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
                <a class="nav-btn nav-link">
                    {% fa5_icon 'ellipsis-v' %}
                    {% trans 'More' %}
                </a>
                <div class="dropdown-menu">
                    <a class="dropdown-item" href="{% url 'home' %}">{% fa5_icon 'euro-sign' %}  {% trans 'EMA' %}</a>
                    <a class="dropdown-item" href="{% url 'home' %}">{% fa5_icon 'file-import' %}  {% trans 'Import...' %}</a>
                    <a class="dropdown-item" href="{% url 'home' %}">{% fa5_icon 'file-export' %}  {% trans 'Export...' %}</a>
                    <a class="dropdown-item" href="{% url 'home' %}">{% fa5_icon 'file-alt' %}  {% trans 'Reports' %}</a>
                </div>
            </li>

        </ul>
        <ul class="navbar-nav ml-auto">
            <li class=" dropdown">
                <div class="btn nav-btn"  data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
                    {% fa5_icon 'user-circle' %}
                    {{ user.username }}
                </div>
                <div class="dropdown-menu dropdown-menu-right">
                    <a class="dropdown-item" href="{% url 'user:index' %}">{% fa5_icon 'cogs' %}  {% trans 'Settings' %}</a>
                    <a class="dropdown-item" href="{% url 'logout' %}">{% fa5_icon 'sign-out-alt' %}  {% trans 'Logout' %}</a>
                </div>
            </li>
        </ul>
    </div>
</nav>