From d328aedebe58afa8e65c26e6ccb2a16ae994823f Mon Sep 17 00:00:00 2001 From: mivinci <1366723936@qq.com> Date: Wed, 4 Aug 2021 09:49:55 +0800 Subject: [PATCH] add toc --- README.md | 5 ++++- data/svg.toml | 3 ++- exampleSite/content/markdown-syntax.md | 1 + exampleSite/content/placeholder-text.md | 1 + layouts/_default/single.html | 26 +++++++++++++------------ layouts/partials/toc.html | 6 ++++++ static/css/main.css | 14 +++++++++++-- static/js/main.js | 5 ++++- 8 files changed, 44 insertions(+), 17 deletions(-) create mode 100644 layouts/partials/toc.html diff --git a/README.md b/README.md index b652d6b..55e6a57 100644 --- a/README.md +++ b/README.md @@ -11,6 +11,7 @@ A Clean and minimal Hugo theme porting from Minima on Hexo. [Click me](https://h - [x] KaTeX - [x] Google analytics - [x] Disqus/OvO comments +- [x] Optional ToC ## Usage @@ -48,10 +49,12 @@ Follow [exampleSite/config.toml](https://github.com/Mivinci/hugo-theme-minima/bl | math | bool | True if the post needs to render math formulas | | comment | bool | True if the post allows people to make comments | | draft | bool | True if the post isn't already to production | +| toc | bool | True if the post needs a ToC | | categories | array | Array of categories the posts belongs to | -| series | array | Array of series the posts belongs to | +| series | array | Array of series the post belongs to | | tags | array | Array of tags the posts is related to | + ### Feedback Feedbacks are welcome [here](https://github.com/Mivinci/hugo-theme-minima/issues). diff --git a/data/svg.toml b/data/svg.toml index 8496be2..95deee7 100644 --- a/data/svg.toml +++ b/data/svg.toml @@ -1,4 +1,5 @@ github = 'GitHub' linkedin = 'LinkedIn' twitter = 'Twitter' -rss = '' \ No newline at end of file +rss = '' +toc = '' \ No newline at end of file diff --git a/exampleSite/content/markdown-syntax.md b/exampleSite/content/markdown-syntax.md index ffe814a..b525499 100644 --- a/exampleSite/content/markdown-syntax.md +++ b/exampleSite/content/markdown-syntax.md @@ -14,6 +14,7 @@ categories = [ ] series = ["Themes Guide"] aliases = ["migrate-from-jekyl"] +toc = true +++ This article offers a sample of basic Markdown syntax that can be used in Hugo content files, also it shows whether basic HTML elements are decorated with CSS in a Hugo theme. diff --git a/exampleSite/content/placeholder-text.md b/exampleSite/content/placeholder-text.md index 238252c..9222b4e 100644 --- a/exampleSite/content/placeholder-text.md +++ b/exampleSite/content/placeholder-text.md @@ -7,6 +7,7 @@ tags = [ "markdown", "text", ] +toc = true +++ Lorem est tota propiore conpellat pectoribus de pectora summo. Redit teque digerit hominumque toris verebor lumina non cervice subde tollit usus habet Arctonque, furores quas nec ferunt. Quoque montibus nunc caluere tempus inhospita parcite confusaque translucet patri vestro qui optatis lumine cognoscere flos nubis! Fronde ipsamque patulos Dryopen deorum. diff --git a/layouts/_default/single.html b/layouts/_default/single.html index 0070bf6..9371de8 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -1,4 +1,7 @@ {{ define "main" }} +{{ if .Params.toc }} +{{ partial "toc.html" . }} +{{ end }}

{{ .Title }}

@@ -14,17 +17,16 @@ {{ .Content }}
- {{ if or .Params.math .Site.Params.math }} - {{ partial "math.html" . }} - {{ end }} - - {{ if and .Params.comment (eq .Site.Params.comment "disqus")}} - {{ partial "disqus.html" . }} - {{ end }} - - {{ if and .Params.comment (eq .Site.Params.comment "ovo")}} - {{ partial "ovo.html" . }} - {{ end }} - +{{ if or .Params.math .Site.Params.math }} +{{ partial "math.html" . }} {{ end }} +{{ if and .Params.comment (eq .Site.Params.comment "disqus")}} +{{ partial "disqus.html" . }} +{{ end }} + +{{ if and .Params.comment (eq .Site.Params.comment "ovo")}} +{{ partial "ovo.html" . }} +{{ end }} + +{{ end }} \ No newline at end of file diff --git a/layouts/partials/toc.html b/layouts/partials/toc.html new file mode 100644 index 0000000..6810b8a --- /dev/null +++ b/layouts/partials/toc.html @@ -0,0 +1,6 @@ +
+ Table of Contents +
+ {{ .TableOfContents }} +
+
\ No newline at end of file diff --git a/static/css/main.css b/static/css/main.css index 9539f39..6def913 100644 --- a/static/css/main.css +++ b/static/css/main.css @@ -70,7 +70,7 @@ a:not(.icon):focus { color: #fff; } -.icon:hover { +a.icon:hover { transform: translateY(-5px); transition: transform .3s ease-in-out; } @@ -178,6 +178,16 @@ main { padding: 2px 8px; } +details.toc ul { + list-style-type: none; + padding-inline-start: 1em; + margin: 0; +} + +details.toc ul>li { + margin: 1em 0; +} + @keyframes showup { from { opacity: 0; @@ -238,4 +248,4 @@ main { ::-webkit-scrollbar-thumb:active { background-color: rgb(128 128 128 / 100%); -} \ No newline at end of file +} diff --git a/static/js/main.js b/static/js/main.js index 70636cf..5ca79f9 100644 --- a/static/js/main.js +++ b/static/js/main.js @@ -14,5 +14,8 @@ window.addEventListener('DOMContentLoaded', function () { classList.add(newTheme); localStorage.theme = newTheme; themeSwitcher.innerHTML = text; - }) + }); + + + }); \ No newline at end of file