<header>
  <%= render Layout::RemoteTranslationsButtonComponent.new(@remote_translations) %>

  <div class="top-links">
    <%= render Layout::LocaleSwitcherComponent.new %>
    <div class="hide-for-small-only">
      <%= render Layout::TopLinksComponent.new %>
    </div>
  </div>

  <div class="top-bar">
    <h1>
      <%= link_to root_path, accesskey: "0" do %>
        <%= image_tag(image_path_for("logo_header.png"), alt: setting["org_name"]) %>
      <% end %>
    </h1>

    <%= render Layout::ResponsiveMenuComponent.new do %>
      <%= render Layout::AccountMenuComponent.new(current_user) %>

      <div class="show-for-small-only">
        <div class="subnavigation subnavigation-with-top-links">
          <%= render Layout::SubnavigationComponent.new %>
          <%= render Layout::TopLinksComponent.new %>
        </div>
      </div>
    <% end %>
  </div>

  <div id="navigation_bar" class="subnavigation">
    <div class="hide-for-small-only">
      <%= render Layout::SubnavigationComponent.new %>
    </div>

    <%= yield :header_addon %>
  </div>
</header>
