4 changed files with 233 additions and 41 deletions
--- a/package-lock.json
+++ b/package-lock.json
@ -38,7 +38,8 @@
    "@types/ejs": {
      "version": "2.6.3",
      "resolved": "https://registry.npmjs.org/@types/ejs/-/ejs-2.6.3.tgz",
-      "integrity": "sha512-/F+qQ0Fr0Dr1YvHjX+FCvbba4sQ27RdCPDqmP/si0e1v1GOkbQ3VRBvZPSQM7NoQ3iz3SyiJVscCP2f0vKuIhQ=="
+      "integrity": "sha512-/F+qQ0Fr0Dr1YvHjX+FCvbba4sQ27RdCPDqmP/si0e1v1GOkbQ3VRBvZPSQM7NoQ3iz3SyiJVscCP2f0vKuIhQ==",
+      "dev": true
    },
    "@types/express": {
      "version": "4.16.1",
@ -70,7 +71,8 @@
    "@types/highlight.js": {
      "version": "9.12.3",
      "resolved": "https://registry.npmjs.org/@types/highlight.js/-/highlight.js-9.12.3.tgz",
-      "integrity": "sha512-pGF/zvYOACZ/gLGWdQH8zSwteQS1epp68yRcVLJMgUck/MjEn/FBYmPub9pXT8C1e4a8YZfHo1CKyV8q1vKUnQ=="
+      "integrity": "sha512-pGF/zvYOACZ/gLGWdQH8zSwteQS1epp68yRcVLJMgUck/MjEn/FBYmPub9pXT8C1e4a8YZfHo1CKyV8q1vKUnQ==",
+      "dev": true
    },
    "@types/htmlparser2": {
      "version": "3.7.31",
@ -83,12 +85,14 @@
    "@types/linkify-it": {
      "version": "2.0.4",
      "resolved": "https://registry.npmjs.org/@types/linkify-it/-/linkify-it-2.0.4.tgz",
-      "integrity": "sha512-9o5piu3tP6DwqT+Cyf7S3BitsTc6Cl0pCPKUhIE5hzQbtueiBXdtBipTLLvaGfT11/8XHRmsagu4YfBesTaiCA=="
+      "integrity": "sha512-9o5piu3tP6DwqT+Cyf7S3BitsTc6Cl0pCPKUhIE5hzQbtueiBXdtBipTLLvaGfT11/8XHRmsagu4YfBesTaiCA==",
+      "dev": true
    },
    "@types/markdown-it": {
      "version": "0.0.7",
      "resolved": "https://registry.npmjs.org/@types/markdown-it/-/markdown-it-0.0.7.tgz",
      "integrity": "sha512-WyL6pa76ollQFQNEaLVa41ZUUvDvPY+qAUmlsphnrpL6I9p1m868b26FyeoOmo7X3/Ta/S9WKXcEYXUSHnxoVQ==",
+      "dev": true,
      "requires": {
        "@types/linkify-it": "*"
      }
@ -115,6 +119,7 @@
      "version": "3.10.32",
      "resolved": "https://registry.npmjs.org/@types/node-sass/-/node-sass-3.10.32.tgz",
      "integrity": "sha1-spbM5xRP+rd7hAkMqtTx5Lvqjgk=",
+      "dev": true,
      "requires": {
        "@types/node": "*"
      }
@ -155,7 +160,8 @@
    "@types/sindresorhus__slugify": {
      "version": "0.6.0",
      "resolved": "https://registry.npmjs.org/@types/sindresorhus__slugify/-/sindresorhus__slugify-0.6.0.tgz",
-      "integrity": "sha512-e67QA1mn1St20y/Ews9EQjUXvfrhZSoD9mqfgQ1LjaSip3zjFwyfiMOdyD6OeBQsuwabTML4ytKyn+PcOwblKA=="
+      "integrity": "sha512-e67QA1mn1St20y/Ews9EQjUXvfrhZSoD9mqfgQ1LjaSip3zjFwyfiMOdyD6OeBQsuwabTML4ytKyn+PcOwblKA==",
+      "dev": true
    },
    "@types/sqlite3": {
      "version": "3.1.4",
@ -268,6 +274,12 @@
      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
      "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU="
    },
+    "async": {
+      "version": "1.5.2",
+      "resolved": "https://registry.npmjs.org/async/-/async-1.5.2.tgz",
+      "integrity": "sha1-7GphrlZIDAw8skHJVhjiCJL5Zyo=",
+      "dev": true
+    },
    "async-foreach": {
      "version": "0.1.3",
      "resolved": "https://registry.npmjs.org/async-foreach/-/async-foreach-0.1.3.tgz",
@ -427,6 +439,12 @@
      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
      "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
    },
+    "colors": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/colors/-/colors-1.0.3.tgz",
+      "integrity": "sha1-BDP0TYCWgP3rYO0mDxsMJi6CpAs=",
+      "dev": true
+    },
    "combined-stream": {
      "version": "1.0.7",
      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.7.tgz",
@ -470,6 +488,12 @@
      "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
      "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac="
    },
+    "corser": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/corser/-/corser-2.0.1.tgz",
+      "integrity": "sha1-jtolLsqrWEDc2XXOuQ2TcMgZ/4c=",
+      "dev": true
+    },
    "cross-spawn": {
      "version": "3.0.1",
      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-3.0.1.tgz",
@ -500,6 +524,15 @@
      "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-1.30.1.tgz",
      "integrity": "sha512-hBSVCvSmWC+QypYObzwGOd9wqdDpOt+0wl0KbU+R+uuZBS1jN8VsD1ss3irQDknRj5NvxiTF6oj/nDRnN/UQNw=="
    },
+    "debug": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+      "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+      "dev": true,
+      "requires": {
+        "ms": "2.0.0"
+      }
+    },
    "decamelize": {
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
@ -575,6 +608,18 @@
        "safer-buffer": "^2.1.0"
      }
    },
+    "ecstatic": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/ecstatic/-/ecstatic-3.3.0.tgz",
+      "integrity": "sha512-EblWYTd+wPIAMQ0U4oYJZ7QBypT9ZUIwpqli0bKDjeIIQnXDBK2dXtZ9yzRCOlkW1HkO8gn7/FxLK1yPIW17pw==",
+      "dev": true,
+      "requires": {
+        "he": "^1.1.1",
+        "mime": "^1.6.0",
+        "minimist": "^1.1.0",
+        "url-join": "^2.0.5"
+      }
+    },
    "ee-first": {
      "version": "1.1.1",
      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
@ -618,6 +663,12 @@
      "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
      "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc="
    },
+    "eventemitter3": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-3.1.0.tgz",
+      "integrity": "sha512-ivIvhpq/Y0uSjcHDcOIccjmYjGLcP09MFGE7ysAwkAvkXfpZlC985pH2/ui64DKazbTW/4kN3yqozUxlXzI6cA==",
+      "dev": true
+    },
    "express": {
      "version": "4.16.4",
      "resolved": "https://registry.npmjs.org/express/-/express-4.16.4.tgz",
@ -718,6 +769,15 @@
        "pinkie-promise": "^2.0.0"
      }
    },
+    "follow-redirects": {
+      "version": "1.6.1",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.6.1.tgz",
+      "integrity": "sha512-t2JCjbzxQpWvbhts3l6SH1DKzSrx8a+SsaVf4h6bG4kOXUuPYS/kg2Lr4gQSb7eemaHqJkOThF1BGyjlUkO1GQ==",
+      "dev": true,
+      "requires": {
+        "debug": "=3.1.0"
+      }
+    },
    "forever-agent": {
      "version": "0.6.1",
      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
@ -757,9 +817,9 @@
      "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
    },
    "fstream": {
-      "version": "1.0.12",
-      "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.12.tgz",
-      "integrity": "sha512-WvJ193OHa0GHPEL+AycEJgxvBEwyfRkN1vhjca23OaPVMCaLCXTd5qAu82AjTcgP1UJmytkOKb63Ypde7raDIg==",
+      "version": "1.0.11",
+      "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz",
+      "integrity": "sha1-XB+x8RdHcRTwYyoOtLcbPLD9MXE=",
      "requires": {
        "graceful-fs": "^4.1.2",
        "inherits": "~2.0.0",
@ -868,6 +928,12 @@
      "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz",
      "integrity": "sha1-4Ob+aijPUROIVeCG0Wkedx3iqLk="
    },
+    "he": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz",
+      "integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==",
+      "dev": true
+    },
    "highlight.js": {
      "version": "9.13.1",
      "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-9.13.1.tgz",
@ -914,6 +980,33 @@
        "statuses": ">= 1.4.0 < 2"
      }
    },
+    "http-proxy": {
+      "version": "1.17.0",
+      "resolved": "https://registry.npmjs.org/http-proxy/-/http-proxy-1.17.0.tgz",
+      "integrity": "sha512-Taqn+3nNvYRfJ3bGvKfBSRwy1v6eePlm3oc/aWVxZp57DQr5Eq3xhKJi7Z4hZpS8PC3H4qI+Yly5EmFacGuA/g==",
+      "dev": true,
+      "requires": {
+        "eventemitter3": "^3.0.0",
+        "follow-redirects": "^1.0.0",
+        "requires-port": "^1.0.0"
+      }
+    },
+    "http-server": {
+      "version": "0.11.1",
+      "resolved": "https://registry.npmjs.org/http-server/-/http-server-0.11.1.tgz",
+      "integrity": "sha512-6JeGDGoujJLmhjiRGlt8yK8Z9Kl0vnl/dQoQZlc4oeqaUoAKQg94NILLfrY3oWzSyFaQCVNTcKE5PZ3cH8VP9w==",
+      "dev": true,
+      "requires": {
+        "colors": "1.0.3",
+        "corser": "~2.0.0",
+        "ecstatic": "^3.0.0",
+        "http-proxy": "^1.8.1",
+        "opener": "~1.4.0",
+        "optimist": "0.6.x",
+        "portfinder": "^1.0.13",
+        "union": "~0.4.3"
+      }
+    },
    "http-signature": {
      "version": "1.2.0",
      "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.2.0.tgz",
@ -1212,6 +1305,12 @@
      "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz",
      "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4="
    },
+    "mime": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
+      "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
+      "dev": true
+    },
    "mime-db": {
      "version": "1.37.0",
      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.37.0.tgz",
@ -1513,6 +1612,30 @@
        "wrappy": "1"
      }
    },
+    "opener": {
+      "version": "1.4.3",
+      "resolved": "https://registry.npmjs.org/opener/-/opener-1.4.3.tgz",
+      "integrity": "sha1-XG2ixdflgx6P+jlklQ+NZnSskLg=",
+      "dev": true
+    },
+    "optimist": {
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/optimist/-/optimist-0.6.1.tgz",
+      "integrity": "sha1-2j6nRob6IaGaERwybpDrFaAZZoY=",
+      "dev": true,
+      "requires": {
+        "minimist": "~0.0.1",
+        "wordwrap": "~0.0.2"
+      },
+      "dependencies": {
+        "minimist": {
+          "version": "0.0.10",
+          "resolved": "http://registry.npmjs.org/minimist/-/minimist-0.0.10.tgz",
+          "integrity": "sha1-3j+YVD2/lggr5IrRoMfNqDYwHc8=",
+          "dev": true
+        }
+      }
+    },
    "os-homedir": {
      "version": "1.0.2",
      "resolved": "http://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
@ -1604,6 +1727,28 @@
        "pinkie": "^2.0.0"
      }
    },
+    "portfinder": {
+      "version": "1.0.20",
+      "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.20.tgz",
+      "integrity": "sha512-Yxe4mTyDzTd59PZJY4ojZR8F+E5e97iq2ZOHPz3HDgSvYC5siNad2tLooQ5y5QHyQhc3xVqvyk/eNA3wuoa7Sw==",
+      "dev": true,
+      "requires": {
+        "async": "^1.5.2",
+        "debug": "^2.2.0",
+        "mkdirp": "0.5.x"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "2.6.9",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
+          "integrity": "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==",
+          "dev": true,
+          "requires": {
+            "ms": "2.0.0"
+          }
+        }
+      }
+    },
    "postcss": {
      "version": "7.0.14",
      "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.14.tgz",
@ -1805,6 +1950,12 @@
      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-1.0.1.tgz",
      "integrity": "sha1-l/cXtp1IeE9fUmpsWqj/3aBVpNE="
    },
+    "requires-port": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
+      "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8=",
+      "dev": true
+    },
    "rimraf": {
      "version": "2.6.3",
      "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.3.tgz",
@ -2108,12 +2259,12 @@
      "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc="
    },
    "tar": {
-      "version": "2.2.2",
-      "resolved": "https://registry.npmjs.org/tar/-/tar-2.2.2.tgz",
-      "integrity": "sha512-FCEhQ/4rE1zYv9rYXJw/msRqsnmlje5jHP6huWeBZ704jUTy02c5AZyWujpMR1ax6mVw9NyJMfuK2CMDWVIfgA==",
+      "version": "2.2.1",
+      "resolved": "http://registry.npmjs.org/tar/-/tar-2.2.1.tgz",
+      "integrity": "sha1-jk0qJWwOIYXGsYrWlK7JaLg8sdE=",
      "requires": {
        "block-stream": "*",
-        "fstream": "^1.0.12",
+        "fstream": "^1.0.2",
        "inherits": "2"
      }
    },
@ -2178,6 +2329,23 @@
      "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-1.0.5.tgz",
      "integrity": "sha512-JoLI4g5zv5qNyT09f4YAvEZIIV1oOjqnewYg5D38dkQljIzpPT296dbIGvKro3digYI1bkb7W6EP1y4uDlmzLg=="
    },
+    "union": {
+      "version": "0.4.6",
+      "resolved": "http://registry.npmjs.org/union/-/union-0.4.6.tgz",
+      "integrity": "sha1-GY+9rrolTniLDvy2MLwR8kopWeA=",
+      "dev": true,
+      "requires": {
+        "qs": "~2.3.3"
+      },
+      "dependencies": {
+        "qs": {
+          "version": "2.3.3",
+          "resolved": "http://registry.npmjs.org/qs/-/qs-2.3.3.tgz",
+          "integrity": "sha1-6eha2+ddoLvkyOBHaghikPhjtAQ=",
+          "dev": true
+        }
+      }
+    },
    "unpipe": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
@ -2191,6 +2359,12 @@
        "punycode": "^2.1.0"
      }
    },
+    "url-join": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/url-join/-/url-join-2.0.5.tgz",
+      "integrity": "sha1-WvIvGMBSoACkjXuCxenC4v7tpyg=",
+      "dev": true
+    },
    "util-deprecate": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
@ -2251,6 +2425,12 @@
        "string-width": "^1.0.2 || 2"
      }
    },
+    "wordwrap": {
+      "version": "0.0.3",
+      "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.3.tgz",
+      "integrity": "sha1-o9XabNXAvAAI03I0u68b7WMFkQc=",
+      "dev": true
+    },
    "wrap-ansi": {
      "version": "2.1.0",
      "resolved": "http://registry.npmjs.org/wrap-ansi/-/wrap-ansi-2.1.0.tgz",
--- a/site/css/main.scss
+++ b/site/css/main.scss
@ -46,6 +46,7 @@ article {
 	&::after {
 		content: "";
 		width: calc(100% - 2 * 30px); // account for .container padding, don't overflow
+		max-width: 720px;
 		height: 1px;
 		background-image: linear-gradient(to right, var(--secondary-ui-text-color), var(--shadow-color));
 		position: absolute;
@ -242,11 +243,7 @@ figure {
 	box-shadow: 0 10px 15px var(--shadow-color);

 	.container {
-		display: flex;
-		flex-direction: row;
-		justify-content: space-between;
-		align-items: flex-end;
-		flex-wrap: wrap;
+		position: relative;
 	}

 	.site-title {
@ -258,7 +255,7 @@ figure {
 	.site-description {
 		color: var(--secondary-ui-text-color);
 		font-variant: small-caps;
-		margin: 0;
+		margin-top: 0;
 	}

 	.site-nav ul {
@ -330,6 +327,14 @@ figure {
 			}
 		}
 	}
+
+	@media (min-width: 992px) {
+		.site-nav {
+			position: absolute;
+			right: 0;
+			bottom: 0;
+		}
+	}
 }

 // Footer
@ -340,11 +345,7 @@ figure {
 	box-shadow: 0 -10px 15px var(--shadow-color);

 	.container {
-		display: flex;
-		flex-direction: row;
-		justify-content: space-between;
-		align-items: flex-start;
-		flex-wrap: wrap;
+		position: relative;
 	}

 	.site-title {
@ -368,6 +369,14 @@ figure {
 			}
 		}
 	}
+
+	@media (min-width: 992px) {
+		.social-links {
+			position: absolute;
+			right: 0;
+			top: 0;
+		}
+	}
 }

 // Pagination
@ -411,19 +420,22 @@ figure {
 	.container {
 		max-width: 540px;
 	}
-
-	article::after {
-		max-width: 540px;
-	}
 }

@media (min-width: 768px) {
 	.container {
 		max-width: 720px;
 	}
+}

-	article::after {
-		max-width: 720px;
+@media (min-width: 992px) {
+	.container {
+		max-width: 960px;
 	}
 }

+@media (min-width: 1200px) {
+	.container {
+		max-width: 1140px;
+	}
+}
--- a/site/layouts/article.html.ejs
+++ b/site/layouts/article.html.ejs
@ -2,15 +2,17 @@
 metadata.layout = "default.html.ejs"
 ```

-<article itemprop="blogPost" itemscope itemtype="https://schema.org/BlogPosting">
+<div class="main">
+	<article itemprop="blogPost" itemscope itemtype="https://schema.org/BlogPosting">
 		<meta itemprop="mainEntityOfPage" content="https://shadowfacts.net<%= metadata.permalink %>">
 		<h1 class="article-title" itemprop="name headline"><%= metadata.title %></h1>
 		<%- include("../includes/article-meta.html.ejs", { metadata }) %>
 		<div class="article-content" itemprop="articleBody">
 			<%- content %>
 		</div>
-</article>
-<section id="comments-container"></section>
+	</article>
+	<section id="comments-container"></section>
+</div>

 <script>
 	const permalink = "<%= metadata.permalink %>";
--- a/site/layouts/default.html.ejs
+++ b/site/layouts/default.html.ejs
@ -46,10 +46,8 @@
 <body itemscope itemtype="https://schema.org/Blog">
 	<header class="site-header">
 		<div class="container">
-			<div>
 			<h1 class="site-title"><%- fancyLink("Shadowfacts", "/") %></h1>
 			<p class="site-description">The outper part of a shadow is called the penumbra.</p>
-			</div>
 			<nav class="site-nav" role="navigation">
 				<ul>
 					<li><%- fancyLink("Tutorials", "/tutorials/") %></li>