diff options
author | Robert Kaussow <mail@geeklabor.de> | 2021-09-01 11:18:00 +0300 |
---|---|---|
committer | GitHub <noreply@github.com> | 2021-09-01 11:18:00 +0300 |
commit | 3f296625fb66c3923858f958fb8ac387e20c65fb (patch) | |
tree | 35b16ee276f6c989d104535b359cf0a1bf083cec | |
parent | 95417625bb92f97d1d1008e5c84a60b84679e915 (diff) |
feat: add tags to post pages (#193)v0.18.0
-rw-r--r-- | exampleSite/config.yaml | 4 | ||||
-rw-r--r-- | exampleSite/content/posts/hello_geekdoc.md | 2 | ||||
-rw-r--r-- | exampleSite/content/usage/configuration.md | 12 | ||||
-rw-r--r-- | exampleSite/content/usage/getting-started.md | 3 | ||||
-rw-r--r-- | layouts/_default/list.html | 1 | ||||
-rw-r--r-- | layouts/partials/menu.html | 16 | ||||
-rw-r--r-- | layouts/posts/list.html | 58 | ||||
-rw-r--r-- | layouts/posts/single.html | 27 | ||||
-rw-r--r-- | layouts/taxonomy/list.html | 62 | ||||
-rw-r--r-- | layouts/taxonomy/taxonomy.html | 0 | ||||
-rw-r--r-- | src/icons/timer.svg | 5 | ||||
-rw-r--r-- | src/sass/_base.scss | 38 | ||||
-rw-r--r-- | src/sass/_utils.scss | 4 |
13 files changed, 203 insertions, 29 deletions
diff --git a/exampleSite/config.yaml b/exampleSite/config.yaml index ace3ab1..ba93833 100644 --- a/exampleSite/config.yaml +++ b/exampleSite/config.yaml @@ -20,9 +20,13 @@ markup: startLevel: 1 endLevel: 9 +taxonomies: + tag: tags + params: # geekdocMenuBundle: true geekdocToC: 3 + geekdocTagsToMenu: true geekdocRepo: https://github.com/thegeeklab/hugo-geekdoc geekdocEditPath: edit/main/exampleSite/content diff --git a/exampleSite/content/posts/hello_geekdoc.md b/exampleSite/content/posts/hello_geekdoc.md index 8e389f3..fe025ed 100644 --- a/exampleSite/content/posts/hello_geekdoc.md +++ b/exampleSite/content/posts/hello_geekdoc.md @@ -2,6 +2,8 @@ title: Hello Geekdoc type: posts date: 2020-01-06 +tags: + - Documentation --- This is the first release of the Geekdoc theme. diff --git a/exampleSite/content/usage/configuration.md b/exampleSite/content/usage/configuration.md index 1258cce..4be4046 100644 --- a/exampleSite/content/usage/configuration.md +++ b/exampleSite/content/usage/configuration.md @@ -29,6 +29,9 @@ enableGitInfo = true startLevel = 1 endLevel = 9 +[taxonomies] + tag = "tags" + [params] # (Optional, default 6) Set how many table of contents levels to be showed on page. # Use false to hide ToC, note that 0 will default to 6 (https://gohugo.io/functions/default/) @@ -97,6 +100,9 @@ enableGitInfo = true # (Optional, default true) Display a "Back to top" link in the site footer. geekdocBackToTop = true + + # (Optional, default false) Enable or disable adding tags for post pages automatically to the navigation sidebar. + geekdocTagsToMenu = true ``` {{< /tab >}} @@ -123,6 +129,9 @@ markup: startLevel: 1 endLevel: 9 +taxonomies: + tag: tags + params: # (Optional, default 6) Set how many table of contents levels to be showed on page. # Use false to hide ToC, note that 0 will default to 6 (https://gohugo.io/functions/default/) @@ -196,6 +205,9 @@ params: # (Optional, default true) Display a "Back to top" link in the site footer. geekdocBackToTop: true + + # (Optional, default false) Enable or disable adding tags for post pages automatically to the navigation sidebar. + geekdocTagsToMenu: true ``` {{< /tab >}} diff --git a/exampleSite/content/usage/getting-started.md b/exampleSite/content/usage/getting-started.md index 433ca0e..3e5d9e6 100644 --- a/exampleSite/content/usage/getting-started.md +++ b/exampleSite/content/usage/getting-started.md @@ -63,6 +63,9 @@ To prepare your new site environment just a few steps are required: [markup.tableOfContents] startLevel = 1 endLevel = 9 + + [taxonomies] + tag = "tags" ``` 5. Test your site. diff --git a/layouts/_default/list.html b/layouts/_default/list.html index 95c7d7b..c27218b 100644 --- a/layouts/_default/list.html +++ b/layouts/_default/list.html @@ -1,5 +1,6 @@ {{ define "main" }} {{ partial "page-header" . }} + <article class="gdoc-markdown gdoc-markdown__align--{{ default "left" (.Page.Params.GeekdocAlign | lower) }}"> <h1>{{ partial "title" . }}</h1> {{ partial "content" . }} diff --git a/layouts/partials/menu.html b/layouts/partials/menu.html index ce21dbc..62b8b97 100644 --- a/layouts/partials/menu.html +++ b/layouts/partials/menu.html @@ -10,6 +10,22 @@ {{ end }} </section> + {{ if and (in (slice "posts" "tags") .Section) (default false .Site.Params.GeekdocTagsToMenu) }} + <section class="gdoc-nav--tags"> + <h2>Tags</h2> + <ul class="gdoc-nav__list"> + {{ $currentPage := .RelPermalink }} + {{ range $name, $taxonomy := .Site.Taxonomies.tags }} + {{ with $.Site.GetPage (printf "/tags/%s" $name) }} + <li> + <a class="gdoc-nav__entry {{ if eq $currentPage .RelPermalink }} is-active {{ end }}" href="{{ .RelPermalink }}">{{ .Title }}</a> + </li> + {{ end }} + {{ end }} + </ul> + </section> + {{ end }} + <section class="gdoc-nav--more"> {{ if .Site.Data.menu.more.more }} <h2>More</h2> diff --git a/layouts/posts/list.html b/layouts/posts/list.html index 0198293..5054bc1 100644 --- a/layouts/posts/list.html +++ b/layouts/posts/list.html @@ -3,24 +3,60 @@ <article class="gdoc-markdown gdoc-post"> <header class="gdoc-post__header"> <h1 class="gdoc-post__title"><a href="{{ .RelPermalink }}">{{ .Title }}</a></h1> - <div class="gdoc-post__date"> - <svg class="icon gdoc_date"><use xlink:href="#gdoc_date"></use></svg> - <time datetime="{{ .Lastmod.Format "2006-01-02T15:04:05Z07:00" | safeHTML }}"> - {{ if ne (.Lastmod.Format "2006-01-02") (.Date.Format "2006-01-02") }} - Updated on - {{ end }} - {{ .Lastmod.Format "Jan 2, 2006" }} - </time> - </div> </header> <section> {{ .Summary }} </section> - {{ if .Truncated }} <div class="gdoc-post__readmore"> + {{ if .Truncated }} <a class="flex-inline align-center fake-link" title="Read full post" href="{{ .RelPermalink }}">Read full post</a> + {{ end }} </div> - {{ end }} + + <footer class="gdoc-post__footer"> + <span class="no-wrap"> + <svg class="icon gdoc_date"><use xlink:href="#gdoc_date"></use></svg> + <span class="gdoc-post__tag"> + <time datetime="{{ .Lastmod.Format "2006-01-02T15:04:05Z07:00" | safeHTML }}"> + {{ if .Lastmod.After (.Date.AddDate 0 0 1) }} + Updated on + {{ end }} + {{ .Lastmod.Format "Jan 2, 2006" }} + </time> + </span> + </span> + + <span class="no-wrap"> + <svg class="icon gdoc_timer"><use xlink:href="#gdoc_timer"></use></svg> + <span class="gdoc-post__tag">{{ .ReadingTime }} min read</span> + </span> + + {{ $tc := 0 }} + {{ with .Params.tags }} + {{ range sort . }} + {{ $name := . }} + {{ with $.Site.GetPage (printf "/tags/%s" $name | urlize) }} + {{ if eq $tc 0 }} + <span class="no-wrap"> + <svg class="icon gdoc_bookmark"><use xlink:href="#gdoc_bookmark"></use></svg> + {{ template "post-tag" dict "name" $name "page" . }} + </span> + {{ else }} + {{ template "post-tag" dict "name" $name "page" . }} + {{ end }} + {{ end }} + {{ $tc = (add $tc 1) }} + {{ end }} + {{ end }} + </footer> </article> {{ end }} {{ end }} + +{{ define "post-tag" }} +<span class="gdoc-post__tag"> + <span class="gdoc-button"> + <a class="gdoc-button__link" href="{{ .page.RelPermalink }}" title="All posts tagged with '{{ .name }}'">{{ .name }}</a> + </span> +</span> +{{ end }} diff --git a/layouts/posts/single.html b/layouts/posts/single.html index 9465e3f..6961586 100644 --- a/layouts/posts/single.html +++ b/layouts/posts/single.html @@ -2,15 +2,24 @@ <article class="gdoc-markdown gdoc-post"> <header class="gdoc-post__header"> <h1 class="gdoc-post__title">{{ .Title }}</h1> - <div class="gdoc-post__date"> - <svg class="icon gdoc_date"><use xlink:href="#gdoc_date"></use></svg> - <time datetime="{{ .Lastmod.Format "2006-01-02T15:04:05Z07:00" | safeHTML }}"> - {{ if ne (.Lastmod.Format "2006-01-02") (.Date.Format "2006-01-02") }} - Updated on - {{ end }} - {{ .Lastmod.Format "Jan 2, 2006" }} - </time> - </div> + <div class="gdoc-post__meta"> + <span class="no-wrap"> + <svg class="icon gdoc_date"><use xlink:href="#gdoc_date"></use></svg> + <span class="gdoc-post__tag"> + <time datetime="{{ .Lastmod.Format "2006-01-02T15:04:05Z07:00" | safeHTML }}"> + {{ if ne (.Lastmod.Format "2006-01-02") (.Date.Format "2006-01-02") }} + Updated on + {{ end }} + {{ .Lastmod.Format "Jan 2, 2006" }} + </time> + </span> + </span> + + <span class="no-wrap"> + <svg class="icon gdoc_timer"><use xlink:href="#gdoc_timer"></use></svg> + <span class="gdoc-post__tag">{{ .ReadingTime }} min read</span> + </span> + </div> </header> <div> {{ partial "content" . }} diff --git a/layouts/taxonomy/list.html b/layouts/taxonomy/list.html index e69de29..5054bc1 100644 --- a/layouts/taxonomy/list.html +++ b/layouts/taxonomy/list.html @@ -0,0 +1,62 @@ +{{ define "main" }} + {{ range .Paginator.Pages }} + <article class="gdoc-markdown gdoc-post"> + <header class="gdoc-post__header"> + <h1 class="gdoc-post__title"><a href="{{ .RelPermalink }}">{{ .Title }}</a></h1> + </header> + <section> + {{ .Summary }} + </section> + <div class="gdoc-post__readmore"> + {{ if .Truncated }} + <a class="flex-inline align-center fake-link" title="Read full post" href="{{ .RelPermalink }}">Read full post</a> + {{ end }} + </div> + + <footer class="gdoc-post__footer"> + <span class="no-wrap"> + <svg class="icon gdoc_date"><use xlink:href="#gdoc_date"></use></svg> + <span class="gdoc-post__tag"> + <time datetime="{{ .Lastmod.Format "2006-01-02T15:04:05Z07:00" | safeHTML }}"> + {{ if .Lastmod.After (.Date.AddDate 0 0 1) }} + Updated on + {{ end }} + {{ .Lastmod.Format "Jan 2, 2006" }} + </time> + </span> + </span> + + <span class="no-wrap"> + <svg class="icon gdoc_timer"><use xlink:href="#gdoc_timer"></use></svg> + <span class="gdoc-post__tag">{{ .ReadingTime }} min read</span> + </span> + + {{ $tc := 0 }} + {{ with .Params.tags }} + {{ range sort . }} + {{ $name := . }} + {{ with $.Site.GetPage (printf "/tags/%s" $name | urlize) }} + {{ if eq $tc 0 }} + <span class="no-wrap"> + <svg class="icon gdoc_bookmark"><use xlink:href="#gdoc_bookmark"></use></svg> + {{ template "post-tag" dict "name" $name "page" . }} + </span> + {{ else }} + {{ template "post-tag" dict "name" $name "page" . }} + {{ end }} + {{ end }} + {{ $tc = (add $tc 1) }} + {{ end }} + {{ end }} + </footer> + </article> + {{ end }} +{{ end }} + +{{ define "post-tag" }} +<span class="gdoc-post__tag"> + <span class="gdoc-button"> + <a class="gdoc-button__link" href="{{ .page.RelPermalink }}" title="All posts tagged with '{{ .name }}'">{{ .name }}</a> + </span> +</span> +{{ end }} diff --git a/layouts/taxonomy/taxonomy.html b/layouts/taxonomy/taxonomy.html deleted file mode 100644 index e69de29..0000000 --- a/layouts/taxonomy/taxonomy.html +++ /dev/null diff --git a/src/icons/timer.svg b/src/icons/timer.svg new file mode 100644 index 0000000..d2da6e5 --- /dev/null +++ b/src/icons/timer.svg @@ -0,0 +1,5 @@ +<!-- Generated by IcoMoon.io --> +<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"> +<title>timer</title> +<path d="M16 29q4.428 0 7.536-3.143t3.107-7.571-3.107-7.536-7.536-3.107-7.536 3.107-3.107 7.536 3.107 7.571 7.536 3.143zM26.714 9.786q1.214 1.571 2.107 4.036t0.893 4.464q0 5.643-4 9.678t-9.714 4.036-9.714-4.036-4-9.678 4-9.678 9.714-4.036q1.929 0 4.464 0.929t4.107 2.143l2.143-2.214q1.143 0.929 2.143 2.143zM14.5 19.857v-9.143h3v9.143h-3zM20.571 0.001v3.071h-9.143v-3.071h9.143z"></path> +</svg> diff --git a/src/sass/_base.scss b/src/sass/_base.scss index babada4..8a154ea 100644 --- a/src/sass/_base.scss +++ b/src/sass/_base.scss @@ -278,7 +278,7 @@ img { cursor: pointer; .icon { - font-size: 0.7rem; + font-size: $font-size-12; } } @@ -311,6 +311,7 @@ img { font-weight: bold; } + &--tags, &--more { padding-top: $padding-8; } @@ -437,14 +438,6 @@ img { } } - &__date { - margin: 1em 0; - - .icon { - font-size: 1.2em; - } - } - &:first-child { border-top: 0; @@ -468,6 +461,33 @@ img { text-decoration: none !important; } } + + &__tag { + margin: $padding-4 0 !important; + + .gdoc-button { + background: var(--body-background); + + &__link { + padding: $padding-4 $padding-8; + } + } + } + + &__meta { + padding-bottom: $padding-16; + } + + &__footer, + &__meta { + :not(:first-child).no-wrap { + margin-left: $padding-8; + } + + .icon { + font-size: $font-size-20; + } + } } .gdoc-footer { diff --git a/src/sass/_utils.scss b/src/sass/_utils.scss index d400f79..e04a716 100644 --- a/src/sass/_utils.scss +++ b/src/sass/_utils.scss @@ -57,6 +57,10 @@ text-align: center; } +.no-wrap { + white-space: nowrap; +} + .hidden { display: none; } |