use hugo's toc

12 files changed, 20 insertions, 31 deletions

diff --git a/README.md b/README.md
index 4b0fcb3..2db2f52 100644
--- a/README.md
+++ b/README.md
@@ -16,7 +16,7 @@ An accessibility-friendly Hugo theme, ported from the [original Cupper](https://
 - [Favicons](#favicons)
 - [Shortcodes](#shortcodes)
 - [Syntax highlighting](#syntax-highlighting)
-- [Disable toc for a blog post](#disable-toc-for-a-blog-post)
+- [Enable Table of Contents for a Blog Post](#enable-table-of-contents-for-a-blog-post)
 - [Localization](#localization)
 - [Custom CSS and JS](#custom-css-and-js)
 - [Default to Dark Theme](#default-to-dark-theme)
@@ -82,14 +82,14 @@ By default, only a few languages are supported. If you want to add more, follow
 1. Download the JS file, then copy it to `static/js/prism.js`
 1. Download the CSS file, then copy it to `static/css/prism.css`
 
-## Disable toc for a blog post
+## Enable Table of Contents for a Blog Post
 
-Blog posts that have two or more subheadings (`<h2>`s) automatically get a table of contents. To disable this set `toc` to `false`. For example:
+Set `toc` to `true`. For example:
 
 ```
 ---
 title: "My page with a few headings"
-toc: false
+toc: true
 ---
 ```
 
diff --git a/assets/css/template-styles.css b/assets/css/template-styles.css
index 74a2eb3..9d4c56e 100644
--- a/assets/css/template-styles.css
+++ b/assets/css/template-styles.css
@@ -431,8 +431,8 @@ caption {
     border: 1px solid;
     padding: 1.5rem;
 }
-.toc h2 {
-    font-size: 1rem;
+.toc nav {
+  margin-top: 1rem;
 }
 .toc ol {
     margin-left: 0.75rem;
diff --git a/assets/js/template-dom-scripts.js b/assets/js/template-dom-scripts.js
index 75b2af5..c2f6b65 100644
--- a/assets/js/template-dom-scripts.js
+++ b/assets/js/template-dom-scripts.js
@@ -53,7 +53,7 @@
 {{ if not .Site.Params.hideHeaderLinks }}
   /* Add "link here" links to <h2> headings */
   (function () {
-    var headings = document.querySelectorAll('main > h2');
+    var headings = document.querySelectorAll('h2, h3, h4, h5, h6');
 
     Array.prototype.forEach.call(headings, function (heading) {
       var id = heading.getAttribute('id');
diff --git a/exampleSite/content/post/creating-a-new-theme.md b/exampleSite/content/post/creating-a-new-theme.md
index 66bb85a..7f32ce4 100644
--- a/exampleSite/content/post/creating-a-new-theme.md
+++ b/exampleSite/content/post/creating-a-new-theme.md
@@ -2,6 +2,7 @@
 date: "2014-09-28"
 tags: ["hugo", "theme", "command-line"]
 title: "Creating a New Theme"
+toc: true
 ---
 
 
diff --git a/exampleSite/content/post/cupper-shortcodes/index.md b/exampleSite/content/post/cupper-shortcodes/index.md
index 76d3032..c30eab6 100644
--- a/exampleSite/content/post/cupper-shortcodes/index.md
+++ b/exampleSite/content/post/cupper-shortcodes/index.md
@@ -2,6 +2,7 @@
 title: "Cupper Shortcodes"
 date: 2019-02-12T23:39:06-06:00
 tags: [hugo, shortcodes]
+toc: true
 ---
 
 ## blockquote
diff --git a/exampleSite/content/post/cupper-typography.md b/exampleSite/content/post/cupper-typography.md
index 9cd7f49..9ee0deb 100644
--- a/exampleSite/content/post/cupper-typography.md
+++ b/exampleSite/content/post/cupper-typography.md
@@ -2,12 +2,12 @@
 title: "Cupper Typography"
 date: 2019-02-14T15:36:09-06:00
 tags: [hugo, markdown]
+toc: true
 ---
 
 ## Headings
 
 ```
-# Heading 1
 ## Heading 2
 ### Heading 3
 #### Heading 4
@@ -15,7 +15,6 @@ tags: [hugo, markdown]
 ###### Heading 6
 ```
 
-# Heading 1
 ## Heading 2
 ### Heading 3
 #### Heading 4
diff --git a/exampleSite/content/post/goisforlovers.md b/exampleSite/content/post/goisforlovers.md
index 5e9f3e1..d218999 100644
--- a/exampleSite/content/post/goisforlovers.md
+++ b/exampleSite/content/post/goisforlovers.md
@@ -2,6 +2,7 @@
 date: "2014-04-02"
 tags: ["go", "templates", "hugo"]
 title: "(Hu)go Template Primer"
+toc: true
 ---
 
 Hugo uses the excellent [Go][] [html/template][gohtmltemplate] library for
@@ -235,7 +236,7 @@ Notice how once we have entered the loop the value of {{ . }} has changed. We
 have defined a variable outside of the loop so we have access to it from within
 the loop.
 
-# Hugo Parameters
+## Hugo Parameters
 
 Hugo provides the option of passing values to the template language
 through the site configuration (for sitewide values), or through the meta
diff --git a/exampleSite/content/post/hugoisforlovers.md b/exampleSite/content/post/hugoisforlovers.md
index a5a1489..d17cdf9 100644
--- a/exampleSite/content/post/hugoisforlovers.md
+++ b/exampleSite/content/post/hugoisforlovers.md
@@ -2,6 +2,7 @@
 date: "2014-04-02"
 tags: ["hugo", "git", "fun"]
 title: "Getting Started with Hugo"
+toc: true
 ---
 
 ## Step 1. Install Hugo
diff --git a/exampleSite/content/post/migrate-from-jekyll.md b/exampleSite/content/post/migrate-from-jekyll.md
index 7c6f6c8..e40016d 100644
--- a/exampleSite/content/post/migrate-from-jekyll.md
+++ b/exampleSite/content/post/migrate-from-jekyll.md
@@ -10,6 +10,7 @@ tags:
 - git
 - templates
 title: Migrate to Hugo from Jekyll
+toc: true
 ---
 
 ## Move static content to `static`
diff --git a/i18n/en.yaml b/i18n/en.yaml
index 3db3cda..dffa54e 100644
--- a/i18n/en.yaml
+++ b/i18n/en.yaml
@@ -13,7 +13,7 @@
 - id: dark_theme
   translation: "dark theme:"
 - id: table_of_contents
-  translation: Table of contents
+  translation: Table of Contents
 - id: publish_date
   translation: "Publish date:"
 - id: last_updated
diff --git a/layouts/partials/toc.html b/layouts/partials/toc.html
index 55a2ccb..cdb0d7c 100644
--- a/layouts/partials/toc.html
+++ b/layouts/partials/toc.html
@@ -1,19 +1,6 @@
-{{ $headings := findRE "<h2.*?>(.|\n])+?</h2>" .Content }}
-{{ if ge (len $headings) 2 }}
+{{ if eq .Params.toc true }}
   <nav class="toc" aria-labelledby="toc-heading">
-    <h2 id="toc-heading">{{ T "table_of_contents" }}</h2>
-    <ol>
-      {{ range $headings }}
-        <li>
-          {{ $id := findRE "id=\".*\"" . }}
-          {{ $id = index $id 0 }}
-          {{ $id = strings.TrimPrefix "id=\"" $id }}
-          {{ $id = strings.TrimSuffix "\"" $id }}
-          <a href="#{{ $id }}">
-            {{ . | htmlUnescape | plainify }}
-          </a>
-        </li>
-      {{ end }}
-    </ol>
+    <strong id="toc-heading">{{ T "table_of_contents" }}</strong>
+    {{ .TableOfContents }}
   </nav>
 {{ end }}
diff --git a/layouts/post/single.html b/layouts/post/single.html
index 9003db6..38512f6 100644
--- a/layouts/post/single.html
+++ b/layouts/post/single.html
@@ -35,10 +35,8 @@
         </ul>
       </div>
     {{ end }}
-    
-    {{ if ne .Params.toc false }}
-      {{ partial "toc" . }}
-    {{ end }}
+
+    {{ partial "toc.html" . }}
 
     {{ .Content }}
   </main>