<a class="skip-navigation" tabindex="1" href="#main-content">{{t 'skip_navigation' }}</a>

<header class="header">
  <div class="logo">
    {{#link 'help_center'}}
      <img src="{{settings.logo}}" alt="{{t 'home_page' name=help_center.name}}">
    {{/link}}
  </div>
  <div class="nav-wrapper">
    <button class="menu-button" aria-controls="user-nav" aria-expanded="false" aria-label="{{t 'toggle_navigation'}}">
      <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" focusable="false" viewBox="0 0 16 16" class="icon-menu">
        <path fill="none" stroke="currentColor" stroke-linecap="round" d="M1.5 3.5h13m-13 4h13m-13 4h13"/>
      </svg>
    </button>
    <nav class="user-nav" id="user-nav">
      {{link 'community'}}
      {{link 'new_request' class='submit-a-request'}}
    </nav>
    {{#if signed_in}}
      <div class="user-info dropdown">
        <button class="dropdown-toggle" aria-haspopup="true">
          {{user_avatar class="user-avatar"}}
          <span class="hide-on-mobile">
            {{user_name}}
            <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" focusable="false" viewBox="0 0 12 12" class="dropdown-chevron-icon" aria-hidden="true">
              <path fill="none" stroke="currentColor" stroke-linecap="round" d="M3 4.5l2.6 2.6c.2.2.5.2.7 0L9 4.5"/>
            </svg>
          </span>
        </button>
        <div class="dropdown-menu" role="menu">
          {{link "my_activities" role="menuitem"}}
          {{my_profile role="menuitem"}}
          {{change_password role="menuitem"}}
          {{link "sign_out" role="menuitem"}}
        </div>
      </div>
    {{else}}
      {{#link "sign_in" class="sign-in"}}
        {{t 'sign_in'}}
      {{/link}}
    {{/if}}
  </div>
</header>
