description = "header partial"

==
{##}


<body data-barba="wrapper">
{% styles %}
<header>
  <div class="container flex align-center">
    <input type="checkbox" id="nav_toggle_cb">
    <div id="nav_head">
      <a href="/" id="logo-link">
        <img class="nav-logo" src="{{ 'assets/logo.svg' | theme }}" width="136" height="48" alt="Godot Engine">
        <img class="nav-logo dark-logo" src="{{ 'assets/logo_dark.svg' | theme }}" width="136" height="48" alt="Godot Engine">
      </a>
      <label for="nav_toggle_cb" id="nav_toggle_btn">
        <img src="{{ 'assets/hamburger.svg' | theme }}" width="24" height="24" alt="">
      </label>
    </div>

    <nav id="nav">
      <ul class="left">
        <li {% if selected == 'features' %} class="active" {% endif %}><a href="/features">Features</a></li>
        <div class="only-on-mobile" style="width: 100%">
          <li {% if this.page.id == 'showcase' %} class="active" {% endif %}><a href="/showcase">Showcase</a></li>
        </div>
        <li {% if selected == 'news' %} class="active" {% endif %}><a href="/news/default/1">News</a></li>
        <li {% if this.page.id == 'community' %} class="active" {% endif %}><a href="/community">Community</a></li>
        <li {% if selected == 'more' %} class="active" {% endif %}><a href="/contact">About</a></li>
        <li><a href="https://godotengine.org/asset-library/asset">Assets</a></li>
      </ul>

      <ul class="right">
        <li {% if selected == 'download' %} class="active" {% endif %}><a href="/download">Download</a></li>
        <li><a href="https://docs.godotengine.org">Learn</a></li>
        <li><a href="https://docs.godotengine.org/en/stable/community/contributing/index.html">Contribute</a></li>
        <li class="fund {% if this.page.id == 'donate' %} active {% endif %}"><a href="/donate">❤ Donate</a></li>
      </ul>
    </nav>
  </div>
</header>

<main data-barba="container" data-barba-namespace="default">
