Add initial Table of Contents

i18n/en.yaml

@@ -1,4 +1,7 @@
 # Post
+- id: post_toc
+  translation: Table of Contents
+
 - id: meta_lastmod
   translation: Updated
 

layouts/_default/single.html

@@ -5,6 +5,12 @@
 				{{- partial "post_thumbnail.html" (dict "page" . ) }}
 				<div class="post__meta meta mb">{{ partial "post_meta.html" . }}</div>
 				<h1 class="post__title">{{ .Title }}</h1>
+				{{ if eq .Params.toc true }}
+					<details class="post__toc toc" {{ if .Params.tocOpen }}open{{ end }}>
+						<summary class="toc__title">{{- T "post_toc" -}}</summary>
+						{{ .TableOfContents }}
+					</details>
+				{{ end }}
 				<div class="post__content">{{ .Content }}</div>
 				<footer class="post__footer">
 					{{ if .Params.tags }}{{ partial "post_tags.html" . }}{{ end }}

static/css/main.css

@@ -19,6 +19,7 @@ html {
 
 article,
 aside,
+details,
 dialog,
 figcaption,
 figure,
@@ -27,7 +28,8 @@ header,
 hgroup,
 main,
 nav,
-section {
+section,
+summary {
 	display: block;
 }
 
@@ -665,6 +667,34 @@ mark {
 	background: #151515;
 }
 
+.post__toc {
+	background: #111;
+	padding: .5rem;
+	margin-bottom: 1rem;
+	color: #f8ae00;
+	list-style: none;
+}
+
+.post__toc[open] {
+	color: #fff;
+}
+
+.post__toc ul {
+	list-style: none;
+	padding-left: 0;
+	padding-top: 1rem;
+}
+
+.post__toc ul ul {
+	padding-left: 2rem;
+	padding-top: 0;
+}
+
+.toc__title {
+	padding: .25rem;
+	font-weight: 700;
+}
+
 /* Comments */
 .comments {
 	margin-top: .625rem;