proxitok/templates/components/navbar.latte

<nav class="navbar" role="navigation" aria-label="main navigation">
  <div class="navbar-brand">
	  <a href="{path('/')}" class="navbar-item">
			{include './icon.latte', icon: 'home', text: 'ProxiTok'}
		</a>
    <a role="button" id="navbar-burger" class="navbar-burger" aria-label="menu" aria-expanded="false">
      <span aria-hidden="true"></span>
      <span aria-hidden="true"></span>
      <span aria-hidden="true"></span>
    </a>
  </div>

  <div id="navbar-menu" class="navbar-menu">
    <div class="navbar-start">
      <a href="{path('/settings')}" class="navbar-item">
				{include './icon.latte', icon: 'options', text: 'Settings'}
			</a>
      <a href="{path('/about')}" class="navbar-item">
				{include './icon.latte', icon: 'info', text: 'About'}
			</a>
    </div>
		<div class="navbar-end">
			<a href="https://github.com/pablouser1/ProxiTok" class="navbar-item" target="_blank">
				{include './icon.latte', icon: 'code-slash', text: 'Source'}
			</a>
		</div>
  </div>
</nav>
<script src="{static('js', 'navbar.js')}"></script>