{% if this.header_color %}
<div class="container-fluid bg-{{ this.header_color }}">
  <nav class="navbar no-background navbar-expand-lg navbar-dark bg-{{ this.header_color }} p-2">
{% elif not this.color %}
<div class="container-fluid bg-primary">
  <nav class="navbar no-background navbar-expand-lg navbar-dark bg-primary p-4">
{% elif this.color == 'primary' %}
<div class="container-fluid bg-primary">
  <nav class="navbar no-background navbar-expand-lg navbar-dark bg-primary p-4">
{% else %}
<div class="container-fluid bg-dark">
  <nav class="navbar no-background navbar-expand-lg navbar-dark bg-dark p-4">
{% endif %}
    <a class="navbar-brand" href="{{ '/'|url(alt=this.alt) }}">
      <img alt="{{ 'The Tor Project' }}" src="{{ '/static/images/tor-logo@2x.png'|asseturl }}" >
      <span class="sr-only">Tor Logo</span>
    </a>

    {% set link = bag('links', this.alt, 'donate') %}
    {% if link %}
      <h4 class="pl-2 pr-2"><a href="{{ link }}" title="{{ _("Donate") }}"><span class="badge badge-warning p-2">{{ _("Donate Now") }}</span></a></h4>
    {% else %}
      <h4 class="pl-2 pr-2"><a href="https://www.torproject.org/donate/{{ this.alt }}" title="{{ _("Donate") }}"><span class="badge badge-warning p-2">{{ _("Donate Now") }}</span></a></h4>
    {% endif %}

    <label for="nav-toggle">
      <a class="btn btn-lg btn-primary navbar-toggler text-white p-3" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
        {{ _("Menu") }} <span class="navbar-toggler-icon ml-1"></span>
      </a>
    </label>
    <input type="checkbox" id="nav-toggle"/>
    <div class="collapse navbar-collapse hamburger-menu" id="navbarSupportedContent">
      <div class="mx-auto">
        <ul class="navbar-nav">
        	{% set menubag = 'menu' %}
        	{% for id, item in bag(menubag).items() %}
        	<li{% if this.path == item.path %} class="nav-item active" {% else %} class="nav-item"{% endif %}>
            {% set link = site.get(item.path) %}
            {% if link %}
              <a class="nav-link" href="{{ item.path|url(alt=this.alt) }}">
            {% else %}
              {% set link = bag('links', this.alt, id) %}
              {% if link %}
                <a class="nav-link" href="{{ link }}">
              {% else %}
                <a class="nav-link" href="{{ item.path }}">
              {% endif %}
            {% endif %}
            {{ _(item.label) }}
              {% if this.path == item.path %}
              <span class="sr-only">(current)</span>
              {% endif %}
            </a>
        	</li>
  	{% endfor %}
        </ul>
      </div>
      {% set alts = bag('alternatives').items() %}
      {% if alts|length > 1 %}
        <div class="btn-group dropdown pull-right">
          {% if not this.color %}
            <button type="button" class="btn btn-primary bg-primary dropdown-toggle btn-block" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
          {% elif this.color == 'primary' %}
            <button type="button" class="btn btn-primary bg-primary dropdown-toggle btn-block" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
          {% else %}
            <button type="button" class="btn btn-dark bg-dark dropdown-toggle btn-block my-3 my-sm-0" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
          {% endif %}
          {{ bag('alternatives', this.alt, 'language') }}
          </button>
          <div class="dropdown-menu">
            {% for id, item in bag('alternatives').items() %}
              {% if this.alt != id %}
                <a class="dropdown-item" href="{{ this.path|url(alt=id) }}">{{ item.language }}</a>
              {% endif %}
            {% endfor %}
          </div>
        </div>
      {% endif %}
      {% set download = site.get('/download') %}
      <div class="pull-right">
        {% if download == None %}
          <a class="btn btn-outline-light pull-right" href="https://www.torproject.org/download/">
        {% else %}
          <a class="btn btn-outline-light pull-right" href="{{ this.url_to(download)|url(alt=this.alt) }}">
        {% endif %}
          {{ _("Download Tor Browser") }}<i class="ml-2 pt-1 fas fa-arrow-down-png"></i>
        </a>
      </div>
    </nav>
</div>
