{% capture content %}
<header>
    <nav class="navbar navbar-toggleable-sm navbar-inverse bg-inverse">
	<button class="navbar-toggler navbar-toggler-right" type="button"
		data-toggle="collapse" data-target="#navbar-content">
	    
	    <span class="navbar-toggler-icon"></span>
	</button>
	<div class="container">
	    
	    <a class="navbar-brand" href="/">Jakob Odersky</a>

	    <div class="collapse navbar-collapse" id="navbar-content">
		<ul class="navbar-nav">
		    <li class="nav-item{% if page.id == "about" %} active{% endif %}">
			<a class="nav-link" href="/">About Me</a>
		    </li>
		    <li class="nav-item{% if page.id == "projects" %} active{% endif %}">
			<a class="nav-link" href="/projects/">Projects</a>
		    </li>
		    <!--<li class="nav-item{% if page.id == "blog" %} active{% endif %}">
			 <a class="nav-link" href="/blog">Blog</a>
			 </li>-->
		</ul>
		<ul class="navbar-nav ml-auto">
		    <li class="nav-item">
			<a class="nav-link" href="/" title="Contact"><i class="fa fa-inverse fa-lg fa-envelope"></i></a>
		    </li>
		    <li class="nav-item">
			<a class="nav-link" href="https://www.github.com/jodersky" title="GitHub"><i class="fa fa-inverse fa-lg fa-github"></i></a>
		    </li>
		    <li class="nav-item">
			<a class="nav-link" href="https://twitter.com/jodersky" title="Twitter"><i class="fa fa-inverse fa-lg fa-twitter"></i></a>
		    </li>
		    <li class="nav-item">
			<a class="nav-link" href="https://www.linkedin.com/in/jodersky" title="LinkedIn"><i class="fa fa-inverse fa-lg fa-linkedin-square"></i></a>
		    </li>
		    <li class="nav-item">
			<a class="nav-link" href="https://keybase.io/jodersky" title="Keybase"><i class="fa fa-inverse fa-lg fa-key"></i></a>
		    </li>
		</ul>

	    </div>
	</div>
    </nav>
</header>
<main class="container">
    {{ content }}
</main>
{% endcapture %}
{% include main.html %}