{{#headerData}}

{{!-- {{isIntranet}} --}}
 
<div class="block centraliser header-inner {{#if ../isIntranet}}intranet{{/if}}">
  <!-- Logotype -->
  <div class="logo header-logo">
    {{#logo}}
    <a href="{{href}}" title="{{title}}">

      <picture>
        <!-- *MUST* be in pixels to avoid inconsistencies between CSS mediaqueries and HTML mediaqueries on Safari (*facepalm*)  -->
        {{#assets}}
        <source media="(max-width: 687px)"
          srcset="{{basePath}}{{green.mobile.src}}">
        <source media="(min-width: 688px) and (max-width: 1087px)"
          srcset="{{basePath}}{{green.tablet.src}}">
        <img src="{{basePath}}{{green.desktop.src}}" alt="{{../alt}}">
        {{/assets}}
      </picture>

    </a>
    {{/logo}}
  </div>
  <div class="header-content">
      <a href="%globals_site_url%">
    %globals_site_metadata_teReoPageName^prepend_if:<p class="tereo-title">^append_if:</p>%
    %globals_site_metadata_MaoriName^prepend_if:<p class="tereo-title">^append_if:</p>%
    <p>%globals_site_metadata_Qualifier^append_if:
      %%globals_site_metadata_hubName^empty:{globals_site_metadata_NameWithoutQualifier}%</p>
      </a>
  </div>

  <div class="header-search">
    <div class="header-search-bar search-button-inside ">
      {{#search}}
        {{#if ../../isIntranet }}
          {{> searchPartial search=intranet}}
        {{else}}
          {{> searchPartial search=public}}
        {{/if}}
      {{/search}}

    </div>
  </div>

  <div class="header-toggle">

    <button role="search" class="search-toggle flat" href="javascript:void(0)">
      <span class="icon-search"></span></button>

    <!--  Menu toggle -->
    <button class="tray-toggle flat" role="toggle-menu">
      <span class="icon-menu"></span>
      <!-- <span class="text-menu-button">MENU</span> -->
    </button>
  </div>
  <!--  tray slide out-->
  <nav class="menu-container main-nav tray tray-closed" aria-label="Main Navigation">
    <div class="tray-content">
      <div class="tray-close">
        <button class="close-tray flat"><span class="icon-cross"></span>Close</button>
      </div>

      <div class="tray-search-bar search-button-inside">

      {{#search}}
        {{#if ../../isIntranet }}
          {{> searchPartial search=intranet}}
        {{else}}
          {{> searchPartial search=public}}
        {{/if}}
      {{/search}}

      </div>

      <div role="menu" class="tray-main-nav">
        <ul class="main-nav-list">
          {{#each navigation.root}}
          <li class="main-nav-item">
            <a role="nav-item" href="{{href}}"
              title="link to {{content}} page" class="main-nav-link">{{content}}</a>
          </li>
          {{/each}}

        </ul>
      </div>
      <div role="sub-menu" class="tray-sub-menu">
        <ul class="sub-menu-list">

          {{#each navigation.alternate}}
          <li class="sub-menu-item">
            <a href="{{href}}" role="menuitem" class="sub-nav-link">{{content}}</a>
          </li>
          {{/each}}

        </ul>

      </div>

    </div>
  </nav>

</div>
 
{{/headerData}}