Added minimal navigation breadcrumbs to doctests.

css/doctest.css

@@ -18,7 +18,7 @@ html {
     margin: 0 auto;
 }
 
-.dark-mode nav{
+.dark-mode nav {
     border-color: var(--white);
 }
 
@@ -264,3 +264,23 @@ canvas {
     width: 100%;
     height: 100%;
 }
+
+#ctxmenu {
+    position: fixed;
+    background: white;
+    color: black;
+    cursor: pointer;
+    border: 1px lightgray solid;
+}
+
+#ctxmenu > a {
+    display: block;
+    padding: 0.25rem 1rem;
+    font-size: 18px;
+    margin: 0.125rem;
+}
+
+#ctxmenu > a:hover {
+    background: black;
+    color: white;
+}

css/index.css

@@ -34,7 +34,9 @@ h3 {
     background-color: rgba(0, 0, 15, 0.5);
 }
 
-a { text-decoration: none; }
+a {
+    text-decoration: none;
+}
 
 div.wrapper {
     overflow: hidden;
@@ -46,28 +48,48 @@ div.wrapper {
 
 /* Color animation from https://www.tjvantoll.com/2012/02/20/css3-color-animations/ */
 @-webkit-keyframes color_change {
-    from { background-color: rgba(0, 0, 0, 0); }
-    to { background-color: red; }
+    from {
+        background-color: rgba(0, 0, 0, 0);
+    }
+    to {
+        background-color: red;
+    }
 }
 
 @-moz-keyframes color_change {
-    from { background-color: rgba(0, 0, 0, 0); }
-    to { background-color: red; }
+    from {
+        background-color: rgba(0, 0, 0, 0);
+    }
+    to {
+        background-color: red;
+    }
 }
 
 @-ms-keyframes color_change {
-    from { background-color: rgba(0, 0, 0, 0); }
-    to { background-color: red; }
+    from {
+        background-color: rgba(0, 0, 0, 0);
+    }
+    to {
+        background-color: red;
+    }
 }
 
 @-o-keyframes color_change {
-    from { background-color: rgba(0, 0, 0, 0); }
-    to { background-color: red; }
+    from {
+        background-color: rgba(0, 0, 0, 0);
+    }
+    to {
+        background-color: red;
+    }
 }
 
 @keyframes color_change {
-    from { background-color: rgba(0, 0, 0, 0); }
-    to { background-color: red; }
+    from {
+        background-color: rgba(0, 0, 0, 0);
+    }
+    to {
+        background-color: red;
+    }
 }
 
 /*** CSS taken from https://medium.com/@jamesfuthey/simulating-the-creation-of-website-thumbnail-screenshots-using-iframes-7145269891db#.7v7fshos5 ***/
@@ -83,7 +105,7 @@ div.wrapper {
 }
 
 .thumbnail::after {
-    content: "";
+    content: '';
     display: block;
     position: absolute;
     top: 0;
@@ -141,16 +163,17 @@ div.title {
 .container {
     margin: 0;
     padding: 0;
+    margin-top: 32px;
     border: 2pt #000;
     min-height: 100%;
     min-width: 100%;
     display: -webkit-flex;
-    -webkit-align-items: flex-end;
-    align-items: flex-end;
+    -webkit-align-items: flex-start;
+    align-items: flex-start;
     -webkit-flex-wrap: wrap;
     flex-wrap: wrap;
-    -webkit-align-content: flex-end;
-    align-content: flex-end;
+    -webkit-align-content: flex-start;
+    align-content: flex-start;
 }
 
 /** See https://github.com/electron/electron/issues/4420 */