Flexbox nav menu

_layouts/blog.html

@@ -12,4 +12,3 @@ layout: default
 			{% endfor %}
 	</div>
 {% endif %}
-

_layouts/default.html

@@ -36,17 +36,14 @@
     </main>
 
     <footer>
-      <nav class="left">
+      <nav>
         <ul>
           <li><a href="{{ '/tartans/' | relative_url }}" title="AKA Plaids">Tartans</a></li>
           <li><a href="{{ '/poems/' | relative_url }}" title="I won't quit my day job">Poems</a></li>
           <li><a href="{{ '/papers/' | relative_url }}" title="Various writings">Papers</a></li>
           <li><a href="{{ '/blog/' | relative_url }}" title="Public Journal">Blog</a></li>
           <li><a href="{{ '/toys/' | relative_url }}" title="Dumb apps">Toys</a></li>
-        </ul>
-      </nav>
-      <nav class="right">
-        <ul>
+          <li class="fill"></li>
           <li><a href="https://github.com/nealey/">GitHub</a></li>
           <li><a href="mailto:neale@woozle.org">Email</a></li>
         </ul>

assets/css/default.css

@@ -76,13 +76,21 @@ footer {
 }
 
 nav ul {
+  display: flex;
   padding: 0;
   margin-top: 0;
   margin-bottom: 1em;
+  flex-wrap: wrap;
 }
-nav li {
+
+nav ul li {
   display: inline;
-  padding-right: 1em;
+  padding: 0 0.5em;
+  flex-grow: 1;
+}
+
+nav ul .fill {
+  flex-grow: 20;
 }
 
 .left {