feat: add tags to post pages (#193)
This commit is contained in:
parent
95417625bb
commit
3f296625fb
13 changed files with 203 additions and 29 deletions
|
@ -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
|
||||
|
|
|
@ -2,6 +2,8 @@
|
|||
title: Hello Geekdoc
|
||||
type: posts
|
||||
date: 2020-01-06
|
||||
tags:
|
||||
- Documentation
|
||||
---
|
||||
|
||||
This is the first release of the Geekdoc theme.
|
||||
|
|
|
@ -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 >}}
|
||||
|
|
|
@ -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.
|
||||
|
|
|
@ -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" . }}
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
</div>
|
||||
{{ 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 }}
|
||||
|
|
|
@ -2,14 +2,23 @@
|
|||
<article class="gdoc-markdown gdoc-post">
|
||||
<header class="gdoc-post__header">
|
||||
<h1 class="gdoc-post__title">{{ .Title }}</h1>
|
||||
<div class="gdoc-post__date">
|
||||
<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>
|
||||
|
|
|
@ -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 }}
|
5
src/icons/timer.svg
Normal file
5
src/icons/timer.svg
Normal file
|
@ -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>
|
After Width: | Height: | Size: 547 B |
|
@ -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 {
|
||||
|
|
|
@ -57,6 +57,10 @@
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
.no-wrap {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue