<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
  {# Brand and toggle get grouped for better mobile display #}
  <div class="navbar-header">
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
      <span class="sr-only">Toggle navigation</span>
      <span class="fa fa-bars"></span>
    </button>
    <a class="navbar-brand" href="{{ request.url_root }}">
      <img src="{{ app.config['LOGO_URL'] | string }}" />
    </a>
  </div>

  <div id="navigation-sections" class="collapse navbar-collapse navbar-ex1-collapse">
    <ul class="nav navbar-nav">
      {%- for navitem in actions.for_category('navigation:section') %}
        {%- if navitem.divider %}<li class="divider"></li>{%- endif %}
        <li class="{{ navitem.status }}">{{ navitem.render() }}</li>
      {%- endfor %}
    </ul>

    <ul id="nav-menu-user" class="nav navbar-nav navbar-right">
      {%- for action in actions.for_category('navigation:user') %}
        {%- if action.divider %}<li class="divider"></li>{%- endif %}
        <li class="{{ action.status }}">{{ action.render() }}</li>
      {%- endfor %}
    </ul>

    {%- if 'abilian.web.search' in app.APP_PLUGINS %}
    <form class="navbar-form navbar-right" role="search" method="GET" action="{{ url_for('search.search_main') }}">
      <input type="text" name="q" class="search-query form-control"
             placeholder="{{ _('Search') }}" autocomplete="off" id="search-box" />
    </form>
    {%- endif %}

    {%- set admin_nav = actions.for_category('navigation:admin') %}
    {%- if admin_nav %}
      <ul id="nav-menu-admin" class="nav navbar-nav navbar-right">
        {%- for action in admin_nav %}
        <li class="{{ action.status }}">{{ action.render() }}</li>
      {%- endfor %}
      </ul>
    {%- endif %}

  </div> {# navbar-collapse #}
</nav>
