<header class="site-header" role="banner">

<div class="site-announcement wrapper">

If you like SST, <a target="_blank" href="{{ site.sst_github_repo }}">give it a star on GitHub</a>! <i class="fa fa-star" aria-hidden="true"></i>

</div>

<div class="wrapper wrapper-header">

<div class="content">

<div class="col1">

<span class="menu-header">

<a class="site-title" href="{{ "/" | relative_url}}">

<img alt="{{ site.title | escape }}" src="/assets/lander/logo/sst.svg" height="36" />

<!--

<img alt="{{ site.title | escape }}" src="/assets/lander/logo/sst-animation-svg0.svg" height="54" />

<img alt="{{ site.title | escape }}" src="/assets/lander/logo/sst-animation-svg1.svg" height="54" />

<img alt="{{ site.title | escape }}" src="/assets/lander/logo/sst-animation-svg2.svg" height="54" />

<img alt="{{ site.title | escape }}" src="/assets/lander/logo/sst-animation-svg3.svg" height="54" />

-->

</a>

<a id="mobile-menu-button" class="menu-button" href="#">

<img src="/assets/lander/menu.svg" />

<img src="/assets/lander/menu-close.svg" />

</a>

</span>

<a class="links" href="{{ site.docs_url }}">Docs</a>

<a class="links" href="{% link guide.md %}">Guide</a>

<a class="links" href="{% link blog/index.md %}">Blog</a>

<a class="links" href="{% link _examples/index.md %}">Examples</a>

</div>

<div class="col2">

<div class="social">

<a title="Discord" class="slack" href="{{ site.discord_invite_url }}">

<span class="icon">

<img src="/assets/lander/discord-mark-white.svg" />

</span>

</a>

<a title="GitHub" class="github" href="{{ site.sst_github_repo }}">

<span class="icon">

<i class="fa fa-github fa-lg"></i>

</span>

<span class="stars">

<i class="fa fa-star" aria-hidden="true"></i>

<span id="github-star-count">{{ site.stats.github_short }}</span>

</span>

</a>

<a title="Twitter" class="twitter" href="{{ site.twitter_url }}">

<span class="icon">

<i class="fa fa-twitter fa-lg" aria-hidden="true"></i>

</span>

</a>

<a title="LinkedIn" class="linkedin" href="{{ site.linkedin_url }}">

<span class="icon">

<i class="fa fa-linkedin fa-lg" aria-hidden="true"></i>

</span>

</a>

</div>

{% include search-field.html %}

</div>

</div>

<!--

<a class="site-announcement" target="_blank" href="{{ site.github_repo }}{{ site.github_issues_prefix }}193">

<i class="fa fa-exclamation-triangle" aria-hidden="true"></i> We recently updated our guide. Read about it here.

</a>

-->

</div>

</header>