<header class="banner">
    <hgroup>
        <h1>
          <img src="{$asset_path}/img/favicon_128.png#"
                height="120"
                loading="lazy"
                alt="logo"><a href="{$titleLink}">{$shaarlititle}</a>
        </h1>
    </hgroup>

    <nav role="navigation">
      <ul>
        {loop="$plugins_header.buttons_toolbar"}
        <li>
          <a
            {loop="$value.attr"}
              {$key}="{$value}"
            {/loop}>
            {$value.html}
          </a>
        </li>
      {/loop}
        {if="$is_logged_in || $openshaarli"}
          <li>
            <a href="{$base_path}/admin/add-shaare">{'Shaare'|t}</a>
          </li>
          <li>
            <a href="{$base_path}/admin/tools">{'Tools'|t}</a>
          </li>
        {/if}
        <li>
          <a href="{$base_path}/tags/cloud">{'Tag cloud'|t}</a>
        </li>
        {if="$thumbnails_enabled"}
          <li>
            <a href="{$base_path}/picture-wall?{function="ltrim($searchcrits, '&')"}">{'Picture wall'|t}</a>
          </li>
        {/if}

        <li>
          <a href="#" title="Toggle Dark/Light theme" aria-label="Toggle Dark/Light theme" onclick="switchTheme();">
            <svg viewBox="0 0 48 48" aria-hidden="true" focusable="false" role="presentation">
              <title>Toggle Dark/Light theme</title>
              <use href="{$asset_path}/sprites/default.svg#ui-light-dark"></use>
          </svg>
          </a>
        </li>
        <li>
          <a href="{$base_path}/feed/{$feed_type}?{$searchcrits}" title="{'RSS Feed'|t}" aria-label="{'RSS Feed'|t}">
            <svg viewBox="0 0 48 48" aria-hidden="true" focusable="false" role="presentation">
              <title>{'RSS Feed'|t}</title>
              <use href="{$asset_path}/sprites/default.svg#ui-feed"></use>
          </svg>
          </a>
        </li>
        {if="!$is_logged_in"}
          <li>
            <a href="{$base_path}/login"
                data-open-id="header-login-form"
                id="login-button" aria-label="{'Login'|t}" title="{'Login'|t}">
                <svg viewBox="0 0 48 48" aria-hidden="true" focusable="false" role="presentation">
                  <title>{'Login'|t}</title>
                  <use href="{$asset_path}/sprites/default.svg#ui-user"></use>
              </svg>
            </a>
          </li>
        {else}
          <li>
            <a href="{$base_path}/admin/logout" aria-label="{'Logout'|t}" title="{'Logout'|t}">
              <svg viewBox="0 0 48 48" aria-hidden="true" focusable="false" role="presentation">
                <title>{'Login'|t}</title>
                <use href="{$asset_path}/sprites/default.svg#ui-logout"></use>
            </svg>
            </a>
          </li>
        {/if}
      </ul>
    </nav>
</header>

<main id="content" class="container" role="main">
{if="!empty($newVersion) || !empty($versionError)"}
  <div class="warning">
    {if="$newVersion"}
      <div>
        Shaarli {$newVersion}
        <a href="https://github.com/shaarli/Shaarli/releases">{'is available'|t}</a>.
      </div>
    {/if}
    {if="$versionError"}
      <div>
        {'Error'|t}: {$versionError}
      </div>
    {/if}
  </div>
{/if}

{if="!empty($plugin_errors) && $is_logged_in"}
  <div class="error">
        {loop="plugin_errors"}
            <p>{$value}</p>
        {/loop}
  </div>
{/if}


{if="!empty($global_errors)"}
  <div class="error">
      {loop="$global_errors"}
        <p>{$value}</p>
      {/loop}
  </div>
{/if}

{if="!empty($global_warnings)"}
  <div class="warning">
      {loop="global_warnings"}
        <p>{$value}</p>
      {/loop}
  </div>
{/if}

{if="!empty($global_successes)"}
  <div class="success">
      {loop="$global_successes"}
      <p>{$value}</p>
      {/loop}
  </div>
{/if}