✨ Add Tables of Contents to articles

layouts/_default/single.html

@@ -1,6 +1,6 @@
 {{ define "main" }}
-  <article class="max-w-prose">
-    <header>
+  <article>
+    <header class="max-w-prose">
       {{ if .Site.Params.article.showBreadcrumbs | default false }}
         {{ partial "breadcrumbs.html" . }}
       {{ end }}
@@ -11,10 +11,19 @@
         {{ partial "article-meta.html" (dict "context" . "scope" "single") }}
       </div>
     </header>
-    <section class="markdown dark:markdown-invert">
-      {{ .Content | emojify }}
+    <section class="flex flex-col max-w-full mt-0 lg:flex-row markdown dark:markdown-invert">
+      {{ if and (.Params.showTableOfContents | default (.Site.Params.article.showTableOfContents | default false)) (in .TableOfContents "<ul") }}
+        <div class="order-first px-0 lg:max-w-xs ltr:lg:pl-8 rtl:lg:pr-8 lg:order-last">
+          <div class="ltr:pl-5 rtl:pr-5 toc lg:sticky lg:top-10">
+            {{ partial "toc.html" . }}
+          </div>
+        </div>
+      {{ end }}
+      <div class="max-w-prose">
+        {{ .Content | emojify }}
+      </div>
     </section>
-    <footer class="pt-8">
+    <footer class="pt-8 max-w-prose">
       {{ partial "author.html" . }}
       {{ partial "sharing-links.html" . }}
       {{ partial "article-pagination.html" . }}