<header>

<nav class="navbar navbar-dark bg-dark navbar-expand-md{% if site.fixed-header == true %} fixed-top{% endif %}">
  <a class="navbar-brand" href="{{ '/' | relative_url }}">
    <img src="{{ '/assets/img/bootstrap-outline.svg' | relative_url }}" width="30" height="30" class="d-inline-block align-top" alt="">
    {{ site.title | escape }}
  </a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarLinks" aria-controls="navbarLinks" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  {%- assign default_paths = site.pages | map: "path" -%}
  {%- assign page_paths = site.header_pages | default: default_paths -%}
  {%- if page_paths -%}
    <div class="collapse navbar-collapse" id="navbarLinks">
      <ul class="navbar-nav mr-auto">
        {%- for path in page_paths -%}
          {%- assign my_page = site.pages | where: "path", path | first -%}
          {%- if my_page.title -%}
            <li class="nav-item {% if page.url == my_page.url %}active{% endif %}">
              <a class="nav-link" href="{{ my_page.url | relative_url }}">{{ my_page.title | escape }}</a>
            </li>
          {%- endif -%}
        {% endfor -%}
      </ul>
    </div>
  {%- endif -%}
</nav>

</header>