Update the internals of the styling a little

Fixes #4

layouts/_default/baseof.html

@@ -6,7 +6,7 @@
         {{- partial "header.html" . -}}
         {{ partial "navbar.html" . }}
 
-        <div class="row">
+        <div class="page">
             {{ if and (ne .Params.Toc false) .IsPage }}
             <div class="side">
                 <h3>Table of Contents</h3>

layouts/_default/list.html

@@ -27,11 +27,12 @@
 {{ else }}
 <small>
     Site-wide tags:
-    <div>
+    <span class="tags">
+        <br />
         {{ range .Site.Taxonomies.tags }}
         <a href="{{ .Page.Permalink }}">#{{ .Page.Title }}</a>&nbsp;
         {{ end }}
-    </div>
+    </span>
 </small>
 {{ end }}
 {{ end }}

layouts/_default/single.html

@@ -1,12 +1,27 @@
 {{ define "main" }}
 <h1>{{ .Title | markdownify }}</h1>
+<!-- I'd like to get rid of the unnaturally large gap between the
+     header and the metadata (date, tags, etc) -->
 {{ if .Date }}
-<time datetime="{{ .Date.Format "2006-01-02" }}" pubdate>
-    {{ .Date.Format "2006-01-02" }}
+<time datetime="{{ .Date.Format "January 2, 2006" }}" pubdate>
+    {{ .Date.Format "January 2, 2006" }}
 </time>
+{{ if ne .Lastmod .Date }}
+( Modified
+<time datetime="{{ .Lastmod.Format "January 2, 2006" }}" pubdate>
+    {{ .Lastmod.Format "January 2, 2006" }}
+</time>
+) <!-- I don't know how to get rid of the whitespace in between here,
+       so I'll just live with it for now. -->
 {{ end }}
-{{ range (.GetTerms "tags") }}
-<a href="{{ .Permalink }}">#{{ .LinkTitle }}</a>
 {{ end }}
+
+<br />
+<span class="tags">
+    {{ range (.GetTerms "tags") }}
+    <a href="{{ .Permalink }}">#{{ .LinkTitle }}</a>
+    {{ end }}
+</span>
+
 {{ .Content }}
 {{ end }}

layouts/partials/navbar.html

@@ -1,6 +1,6 @@
-<div class="navbar">
+<nav id="main">
     <a href="{{ "/" | relURL }}">Home</a>
     {{ range .Site.Menus.main }}
     <a href="{{ .URL }}">{{ .Name }}</a>
     {{ end }}
-</div>
+</nav>

static/css/bobatheme.css

@@ -1,10 +1,10 @@
 @media screen and (max-width: 700px) {
-  .row {
+  .page {
     flex-direction: column;
   }
 }
 @media screen and (max-width: 400px) {
-  .navbar a {
+  #main a {
     float: none;
     width: 100%;
   }
@@ -35,11 +35,11 @@ blockquote {
   font-size: 40px;
 }
 
-.navbar {
+#main {
   overflow: hidden;
   background-color: #222;
 }
-.navbar a {
+#main a {
   float: left;
   display: block;
   color: lightgray;
@@ -47,7 +47,7 @@ blockquote {
   padding: 14px 20px;
   text-decoration: none;
 }
-.navbar a:hover {
+#main a:hover {
   background-color: #444;
   color: white;
 }
@@ -55,7 +55,7 @@ blockquote {
 * {
   box-sizing: border-box;
 }
-.row {
+.page {
   flex: 1;
   display: flex;
   flex-wrap: wrap;