github
/
hugo-geekdoc
mirror of https://github.com/thegeeklab/hugo-geekdoc.git
0
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat: add tags to post pages (#193)

This commit is contained in:
Robert Kaussow 2021-09-01 10:18:00 +02:00 committed by GitHub
parent 95417625bb
commit 3f296625fb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
13 changed files with 203 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
exampleSite/config.yaml
View File

@ -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
exampleSite/content/posts/hello_geekdoc.md
View File

@ -2,6 +2,8 @@
title: Hello Geekdoc
type: posts
date: 2020-01-06
tags:
- Documentation
---
This is the first release of the Geekdoc theme.

12
exampleSite/content/usage/configuration.md
View File

@ -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 >}}

3
exampleSite/content/usage/getting-started.md
View File

@ -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
layouts/_default/list.html
View File

@ -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" . }}

16
layouts/partials/menu.html
View File

@ -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>

58
layouts/posts/list.html
View File

@ -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 }}

27
layouts/posts/single.html
View File

@ -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" . }}

62
layouts/taxonomy/list.html
View File

@ -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 }}

0
layouts/taxonomy/taxonomy.html
View File

5
src/icons/timer.svg Normal file
View 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>
Side by Side

After

Width:  |  Height:  |  Size: 547 B

38
src/sass/_base.scss
View File

@ -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 {

4
src/sass/_utils.scss
View File

@ -57,6 +57,10 @@
text-align: center;
}
.no-wrap {
white-space: nowrap;
}
.hidden {
display: none;
}