diff options
author | Henk Verlinde <henk@ventizo.com> | 2022-06-27 15:41:00 +0300 |
---|---|---|
committer | Henk Verlinde <henk@ventizo.com> | 2022-06-27 15:41:00 +0300 |
commit | 59a3f00529dbacae1882c9a27b38eac7d3a5ef83 (patch) | |
tree | 7c4a7b85830d6b2f1b1522d1bd98a58ba22a72c4 | |
parent | 9f2a3fbbc5c2d6b79f0f74287eb2938fe222edbd (diff) |
feat: update blog pages
-rw-r--r-- | assets/images/.gitkeep | 0 | ||||
-rw-r--r-- | assets/images/default-image.png (renamed from content/en/blog/say-hello-to-doks/say-hello-to-doks.png) | bin | 8211 -> 8211 bytes | |||
-rw-r--r-- | assets/js/highlight.js | 2 | ||||
-rw-r--r-- | assets/scss/common/_global.scss | 4 | ||||
-rw-r--r-- | assets/scss/layouts/_posts.scss | 35 | ||||
-rw-r--r-- | config/_default/config.toml | 14 | ||||
-rw-r--r-- | config/_default/params.toml | 4 | ||||
-rw-r--r-- | content/en/blog/say-hello-to-doks/index.md | 6 | ||||
-rw-r--r-- | layouts/_default/list.html | 35 | ||||
-rw-r--r-- | layouts/_default/terms.html | 20 | ||||
-rw-r--r-- | layouts/blog/list.html | 24 | ||||
-rw-r--r-- | layouts/blog/single.html | 37 | ||||
-rw-r--r-- | layouts/contributors/list.html | 23 | ||||
-rw-r--r-- | layouts/partials/content/card-image.html | 14 | ||||
-rw-r--r-- | layouts/partials/header/header.html | 2 |
15 files changed, 154 insertions, 66 deletions
diff --git a/assets/images/.gitkeep b/assets/images/.gitkeep deleted file mode 100644 index e69de29..0000000 --- a/assets/images/.gitkeep +++ /dev/null diff --git a/content/en/blog/say-hello-to-doks/say-hello-to-doks.png b/assets/images/default-image.png Binary files differindex 70d8c78..70d8c78 100644 --- a/content/en/blog/say-hello-to-doks/say-hello-to-doks.png +++ b/assets/images/default-image.png diff --git a/assets/js/highlight.js b/assets/js/highlight.js index c96b781..4ad6017 100644 --- a/assets/js/highlight.js +++ b/assets/js/highlight.js @@ -7,6 +7,7 @@ import xml from 'highlight.js/lib/languages/xml'; import ini from 'highlight.js/lib/languages/ini'; import yaml from 'highlight.js/lib/languages/yaml'; import markdown from 'highlight.js/lib/languages/markdown'; +import python from 'highlight.js/lib/languages/python'; hljs.registerLanguage('javascript', javascript); hljs.registerLanguage('json', json); @@ -16,6 +17,7 @@ hljs.registerLanguage('ini', ini); hljs.registerLanguage('toml', ini); hljs.registerLanguage('yaml', yaml); hljs.registerLanguage('md', markdown); +hljs.registerLanguage('python', python); document.addEventListener('DOMContentLoaded', () => { document.querySelectorAll('pre code:not(.language-mermaid)').forEach((block) => { diff --git a/assets/scss/common/_global.scss b/assets/scss/common/_global.scss index cbc8e41..e1cee67 100644 --- a/assets/scss/common/_global.scss +++ b/assets/scss/common/_global.scss @@ -4,7 +4,9 @@ .error404 .content, .docs.list .content, .tutorial.list .content, -.showcase.list .content { +.showcase.list .content, +.categories.list .content, +.tags.list .content { padding-top: 1rem; padding-bottom: 3rem; } diff --git a/assets/scss/layouts/_posts.scss b/assets/scss/layouts/_posts.scss index da27660..27d316a 100644 --- a/assets/scss/layouts/_posts.scss +++ b/assets/scss/layouts/_posts.scss @@ -1,6 +1,9 @@ .home .card, .contributors.list .card, -.blog.list .card { +.blog.list .card, +.blog.single .card, +.categories.list .card, +.tags.list .card { margin-top: 2rem; margin-bottom: 2rem; transition: transform 0.3s; @@ -8,16 +11,34 @@ .home .card:hover, .contributors.list .card:hover, -.blog.list .card:hover { +.blog.list .card:hover, +.blog.single .card:hover, +.categories.list .card:hover, +.tags.list .card:hover { transform: scale(1.025); } +.contributors.list .card.card-terms:hover, +.categories.list .card.card-terms:hover, +.tags.list .card.card-terms:hover { + transform: none; +} + .home .card-body, .contributors.list .card-body, -.blog.list .card-body { +.blog.list .card-body, +.blog.single .card-body, +.categories.list .card-body, +.tags.list .card-body { padding: 0 2rem 1rem; } +.contributors.list .card-terms .card-body, +.categories.list .card-terms .card-body, +.tags.list .card-terms .card-body { + padding: 1rem; +} + .blog-header { text-align: center; margin-bottom: 2rem; @@ -26,3 +47,11 @@ .blog-footer { text-align: center; } + +.related-posts { + margin-top: 4rem; +} + +h2.section-title { + margin-bottom: 1.25rem; +} diff --git a/config/_default/config.toml b/config/_default/config.toml index 086f8b4..321aa14 100644 --- a/config/_default/config.toml +++ b/config/_default/config.toml @@ -69,6 +69,20 @@ rel = "sitemap" [minify.tdewolff.html] keepWhitespace = false +[related] + threshold = 80 + includeNewer = true + toLower = false + [[related.indices]] + name = "categories" + weight = 100 + [[related.indices]] + name = "tags" + weight = 80 + [[related.indices]] + name = "date" + weight = 10 + [module] [module.hugoVersion] extended = true diff --git a/config/_default/params.toml b/config/_default/params.toml index 5780d96..3af900c 100644 --- a/config/_default/params.toml +++ b/config/_default/params.toml @@ -53,6 +53,10 @@ portraitPhotoWidths = [800, 700, 600, 500] lqipWidth = "20x" smallLimit = "300" +### Image template +defaultImage = "default-image.png" # put in `./assets/images/` +fillImage = "1270x740 Center" # normalize image size + # Footer footer = "Powered by <a class=\"text-muted\" href=\"https://www.netlify.com/\">Netlify</a>, <a class=\"text-muted\" href=\"https://gohugo.io/\">Hugo</a>, and <a class=\"text-muted\" href=\"https://getdoks.org/\">Doks</a>" diff --git a/content/en/blog/say-hello-to-doks/index.md b/content/en/blog/say-hello-to-doks/index.md index d86eb93..cc97343 100644 --- a/content/en/blog/say-hello-to-doks/index.md +++ b/content/en/blog/say-hello-to-doks/index.md @@ -6,9 +6,9 @@ date: 2020-11-04T09:19:42+01:00 lastmod: 2020-11-04T09:19:42+01:00 draft: false weight: 50 -images: ["say-hello-to-doks.png"] -categories: [] -tags: [] +images: [] +categories: ["Startups", "News"] +tags: ["security"] contributors: ["Henk Verlinde"] pinned: false homepage: false diff --git a/layouts/_default/list.html b/layouts/_default/list.html index 1401ccd..2778b20 100644 --- a/layouts/_default/list.html +++ b/layouts/_default/list.html @@ -1,13 +1,32 @@ {{ define "main" }} <div class="row justify-content-center"> - <div class="col-md-12 col-lg-10 col-xl-8"> - {{ range .Paginator.Pages }} - <article> - <h2><a href="{{ .RelPermalink }}">{{ .Title }}</a></h2> - {{ .Description }} - </article> - {{ end }} - {{ template "_internal/pagination.html" . }} + <div class="col-md-12 col-lg-9"> + <h1 class="text-center">{{ .Title }}</h1> + {{ with .Content -}}<div class="text-center">{{ . }}</div>{{ end -}} + </div> +</div> +<div class="row row-cols-1 row-cols-lg-2 g-lg-5"> + {{ $paginator := .Paginate (.Data.Pages) -}} + {{ range $paginator.Pages -}} + <div class="col"> + <div class="card"> + {{- .Scratch.Set "fillImage" "1270x620 Center" -}} + {{ partial "content/card-image.html" . }} + <div class="card-body"> + <article> + <h2 class="h3"><a class="stretched-link text-body" href="{{ .RelPermalink }}">{{ .Params.title }}</a></h2> + <p>{{ .Params.excerpt | safeHTML }}</p> + {{ partial "main/blog-meta.html" . -}} + </article> + </div> + </div> + </div> + {{ end -}} +</div> +<div class="row justify-content-center"> + <div class="col-md-12 col-lg-9"> + {{ $.Scratch.Set "paginator" true }} + {{ template "_internal/pagination.html" . }} </div> </div> {{ end }}
\ No newline at end of file diff --git a/layouts/_default/terms.html b/layouts/_default/terms.html new file mode 100644 index 0000000..73fdeb8 --- /dev/null +++ b/layouts/_default/terms.html @@ -0,0 +1,20 @@ +{{ define "main" }} +<div class="row justify-content-center"> + <div class="col-md-12 col-lg-10 col-xl-8"> + <h1 class="text-center">{{ .Title }}</h1> + <div class="text-center">{{ .Content }}</div> + <div class="card-list"> + {{ range .Paginator.Pages }} + <div class="card card-terms my-3"> + <div class="card-body"> + <article> + <a class="stretched-link" href="{{ .RelPermalink }}">{{ .Params.title | title }} →</a> + </article> + </div> + </div> + {{ end }} + </div> + {{ template "_internal/pagination.html" . }} + </div> +</div> +{{ end }} diff --git a/layouts/blog/list.html b/layouts/blog/list.html deleted file mode 100644 index 4e2a770..0000000 --- a/layouts/blog/list.html +++ /dev/null @@ -1,24 +0,0 @@ -{{ define "main" }} -<div class="row justify-content-center"> - <div class="col-md-12 col-lg-10 col-xl-8"> - <article> - <h1 class="text-center">{{ .Title }}</h1> - <div class="text-center">{{ .Content }}</div> - <div class="card-list"> - {{ $paginator := .Paginate (.Data.Pages) -}} - {{ range $paginator.Pages -}} - <div class="card"> - <div class="card-body"> - <h2 class="h3"><a class="stretched-link text-body" href="{{ .RelPermalink }}">{{ .Params.title }}</a></h2> - <p>{{ .Params.excerpt | safeHTML }}</p> - {{ partial "main/blog-meta.html" . -}} - </div> - </div> - {{ end -}} - {{ $.Scratch.Set "paginator" true }} - {{ template "_internal/pagination.html" . }} - </div> - </article> - </div> -</div> -{{ end }}
\ No newline at end of file diff --git a/layouts/blog/single.html b/layouts/blog/single.html index 2ff4294..87cdd29 100644 --- a/layouts/blog/single.html +++ b/layouts/blog/single.html @@ -8,13 +8,13 @@ {{ partial "main/blog-meta.html" . }} </div> </div> - <div class="col-md-12"> + <div class="col-md-13"> <div class="mt-n3"> {{- .Scratch.Set "fillImage" "1270x620 Center" -}} {{ partial "content/figure.html" . }} </div> </div> - <div class="col-md-12 col-lg-10 col-xl-8"> + <div class="col-md-12 col-lg-9"> {{ .Content }} {{ if .Params.tags -}} <div class="mt-4"> @@ -26,4 +26,35 @@ </div> </div> </article> -{{ end }}
\ No newline at end of file + +{{ $related := .Site.RegularPages.Related . | first 3 -}} +{{ with $related -}} +<div class="related-posts"> +<div class="row justify-content-center"> + <div class="col"> + <h2 class="section-title">Related posts</h2> + </div> +</div> +<div class="row row-cols-1 row-cols-md-2 row-cols-lg-3 g-lg-5"> + {{ range . -}} + <div class="col"> + <div class="card"> + {{- .Scratch.Set "fillImage" "1270x620 Center" -}} + {{ partial "content/card-image.html" . }} + <div class="card-body"> + <article> + <h2 class="h3"><a class="stretched-link text-body" href="{{ .RelPermalink }}">{{ .Params.title }}</a></h2> + <p>{{ .Params.excerpt | safeHTML }}</p> + {{ partial "main/blog-meta.html" . -}} + </article> + </div> + </div> + </div> + {{ end -}} +</div> +</div> +{{ end -}} + +{{ end }} + + diff --git a/layouts/contributors/list.html b/layouts/contributors/list.html deleted file mode 100644 index 414646e..0000000 --- a/layouts/contributors/list.html +++ /dev/null @@ -1,23 +0,0 @@ -{{ define "main" }} -<div class="row justify-content-center"> - <div class="col-md-12 col-lg-10 col-xl-8"> - <article> - <h1 class="text-center">{{ .Title }}</h1> - <div class="text-center">{{ .Content }}</div> - <div class="card-list"> - {{ range .Data.Pages -}} - <div class="card"> - <div class="card-body"> - <h2 class="h3"><a class="stretched-link text-body" href="{{ .RelPermalink }}">{{ .Params.title }}</a></h2> - {{ if eq .Section "blog" -}} - <p>{{ .Params.excerpt | safeHTML }}</p> - {{ partial "main/blog-meta.html" . -}} - {{ end -}} - </div> - </div> - {{ end -}} - </div> - </article> - </div> -</div> -{{ end }}
\ No newline at end of file diff --git a/layouts/partials/content/card-image.html b/layouts/partials/content/card-image.html new file mode 100644 index 0000000..c20f2da --- /dev/null +++ b/layouts/partials/content/card-image.html @@ -0,0 +1,14 @@ +{{ $fillImage := .Scratch.Get "fillImage" }} +{{ if not $fillImage -}} + {{ $fillImage = site.Params.fillImage }} +{{ end -}} + +{{ $image := .Resources.GetMatch (printf "**%s" (index .Params.images 0)) }} +{{ if not $image -}} + {{ $image = resources.Get (printf "%s%s" "images/" site.Params.defaultImage) }} +{{ end -}} + +{{ $image = $image.Fill $fillImage }} +{{ $lqip := $image.Resize site.Params.lqipWidth -}} + +<img class="card-img-top img-fluid lazyload blur-up" src="{{ $lqip.Permalink }}" data-src="{{ $image.Permalink }}" width="{{ $image.Width }}" height="{{ $image.Height }}" alt="{{ .Title }}"> diff --git a/layouts/partials/header/header.html b/layouts/partials/header/header.html index 65744ec..9881d8c 100644 --- a/layouts/partials/header/header.html +++ b/layouts/partials/header/header.html @@ -53,7 +53,7 @@ {{- $active := or ($current.IsMenuCurrent "main" .) ($current.HasMenuCurrent "main" .) -}} {{- $active = or $active (eq .Name $current.Title) -}} {{- $active = or $active (and (eq .Name ($section | humanize)) (eq $current.Section $section)) -}} - {{- $active = or $active (and (eq .Name "Blog") (eq $current.Section "blog" "contributors")) -}} + {{- $active = or $active (and (eq .Name "Blog") (eq $current.Section "blog" "contributors" "categories" "tags")) -}} {{ if .HasChildren }} <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle ps-0 py-1" href="#" id="navbarDropdownMenuLink" role="button" data-bs-toggle="dropdown" aria-expanded="false"> |