package.json: Run webpack with npx

My local dev environment automatically adds ./node_modules/.bin to
the shell PATH, but it seems a better way to do this is to use npx
so that it works here and on the CI.

.build.yml

@@ -0,0 +1,15 @@
+image: archlinux
+packages:
+  - nodejs-lts-erbium
+  - npm
+sources:
+  - https://git.sr.ht/~alanorth/hugo-theme-bootstrap4-blog
+tasks:
+  - setup: |
+      id
+      node -v
+      cd hugo-theme-bootstrap4-blog
+      npm install 
+  - test: |
+      cd hugo-theme-bootstrap4-blog
+      npm run build

.drone.yml

@@ -0,0 +1,34 @@
+kind: pipeline
+type: docker
+name: node12
+
+steps:
+- name: build
+  image: node:12-alpine
+  commands:
+  - npm install
+  - npm run build
+
+---
+kind: pipeline
+type: docker
+name: node14
+
+steps:
+- name: build
+  image: node:14-alpine
+  commands:
+  - npm install
+  - npm run build
+
+---
+kind: pipeline
+type: docker
+name: node15
+
+steps:
+- name: build
+  image: node:15-alpine
+  commands:
+  - npm install
+  - npm run build

.travis.yml

@@ -1,10 +0,0 @@
-language: node_js
-node_js:
-  - 6
-  - 8
-  - 9
-script: npm run build
-sudo: false
-dist: trusty
-
-# vim: ts=2 sw=2 et

CHANGELOG.md

@@ -0,0 +1,114 @@
+# Changelog
+All notable changes to this project will be documented in this file.
+
+The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
+and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+
+## Unreleased Changes
+### Updated
+- Bootstrap v4.6.0, webpack v5.16.0, haven 0.6.2, etc
+
+## [[ 1.6.0 ]] - 2020-12-05
+### Changed
+- Migrate to dart sass from node-sass (see [LibSass is Deprecated](https://sass-lang.com/blog/libsass-is-deprecated))
+- Use new [figure shortcode](https://cpbotha.net/2020/05/02/drop-in-replacement-for-hugo-figure-shortcode-with-responsive-img-srcset/a) that automatically processes images in a post's page bundle to multiple resolutions and outputs an appropriate img srcset (falls back to getting images from static dir)
+
+## [[1.5.1]] - 2020-11-15
+### Updated
+- Minor version bump for bootstrap, node-sass, and fontawesome
+- Update to webpack 5 (brings better tree shaking, reduces fontawesome JS by 8K)
+
+### Fixed
+- JSON-LD keyword formatting @jeremyrcampb #140
+
+### Added
+- Ability to omit date in front matter @jeremyrcampb #141
+
+## [[1.5.0]] - 2020-05-17
+### Updated
+- i18n language keys for German (#dermellor, #131)
+- Boostrap v4.5.0
+- Minor version bump for webpack, node-sass, and fontawesome
+
+### Changed
+- Use Haven for GDPR-compliant popup instead of cookieconsent, which is now
+configured as *opt-in* and does not load Google Analytics or send a hit until
+the user agrees.
+  - Note to translators that some strings have changed, please check:
+    - `cookieAccept`: the string for the "Agree" button
+    - `cookieDecline`: the string for the "Disagree" button
+
+## [[1.4.2]] - 2020-03-22
+### Fixed
+- Encoding of dates in HTML (@alanorth)
+
+## [[1.4.1]] - 2020-03-19
+### Updated
+- npm dependencies: rtlcss 2.5.0, webpack 4.42.0, fontawesome solid icons 5.12.1
+
+### Fixed
+- Fix "Unparsable structured data" error in JSON-LD (@alanorth)
+
+## [[1.4.0]] - 2020-01-28
+### Added
+- Farsi strings for user interface
+
+### Updated
+- bootstrap 4.4.1
+- Fix typo in README.md (@xekon, #118)
+- Font Awesome 5 (make sure you [update](https://fontawesome.com/how-to-use/on-the-web/setup/upgrading-from-version-4) any custom icons you might be using in your content, site layouts, partials, etc).
+
+### Changed
+- Use Hugo's built-in subresource integrity support instead of the generatesri
+tooling that I wrote by hand a few years ago (#120, @alanorth)
+- Use Font Awesome SVGs via JavaScript instead of web fonts (@alanorth)
+- Category and tag links now have a trailing slash (#128, @alanorth)
+
+### Removed
+- Several references to Google Plus (@xekon, #122)
+
+## [[1.3.3]] - 2019-12-02
+### Fixed
+- "Home" link for blogs that are not at the root of the domain (@phofman #115)
+
+### Changed
+- Use "posts" instead of "post" in exampleSite to align closer with Hugo quick start docs (@sboots #117)
+
+### Updated
+- node-sass 4.13.0 and rtlcss 2.4.1
+
+## [[1.3.2]] - 2019-06-20
+### Changed
+- Only list "Regular" pages in recent posts in sidebar (@alanorth)
+- Use absURL instead of baseURL to be more robust with different site configurations (@TommySprat)
+- Quote date in post metadata so it does not get escaped (@TommySprat #111)
+
+## [1.3.1] - 2019-05-05
+### Added
+- SourceHut CI configuration (@alanorth)
+
+### Updated
+- Twitter sharing button (@alanorth)
+- Dependencies in package.json (@alanorth)
+
+## [1.3.0] - 2019-04-22
+### Added
+- Arabic translation (@alanorth)
+- Support for RTL CSS (@alanorth)
+
+### Updated
+- clean-css-cli 4.3.0
+
+## [1.2.1] - 2019-04-14
+### Added
+- Dutch translation #107 (@bit33)
+
+### Removed
+- Google+ icons #108 (@bit33)
+
+### Updated
+- Template functions for Hugo 0.55.0 (@alanorth)
+
+## [1.2.0] - 2019-02-13
+### Updated
+- Bootstrap v4.3.1

README.md

@@ -1,4 +1,4 @@
-# Hugo Bootstrap v4 Blog [![Build Status](https://travis-ci.org/alanorth/hugo-theme-bootstrap4-blog.svg?branch=master)](https://travis-ci.org/alanorth/hugo-theme-bootstrap4-blog)
+# Hugo Bootstrap v4 Blog [![Build Status](https://ci.mjanja.ch/api/badges/alanorth/hugo-theme-bootstrap4-blog/status.svg)](https://ci.mjanja.ch/alanorth/hugo-theme-bootstrap4-blog) [![builds.sr.ht status](https://builds.sr.ht/~alanorth/hugo-theme-bootstrap4-blog.svg)](https://builds.sr.ht/~alanorth/hugo-theme-bootstrap4-blog?)
 A simple but opinionated [Hugo](https://gohugo.io) theme geared towards blog-style content. Based on the older two-column [Bootstrap blog example](https://v4-alpha.getbootstrap.com/examples/blog/) that was used for several Bootstrap versions, but has now been retired in favor of a "snarky" (their words) new example as of version [4.0.0's final release](https://blog.getbootstrap.com/2018/01/18/bootstrap-4/).
 
 ![Screenshot](https://raw.githubusercontent.com/alanorth/hugo-theme-bootstrap4-blog/master/screenshot.png "Screenshot")
@@ -11,14 +11,14 @@ See [picturingjordan.com](https://picturingjordan.com) for an example of this th
 - Uses Bootstrap v4's [native system font stack](https://getbootstrap.com/docs/4.0/content/reboot/#native-font-stack) to load quickly and look good on all platforms
 - Excellent [structured data](https://developers.google.com/search/docs/guides/intro-structured-data) (JSON-LD), [OpenGraph](http://ogp.me), and [Twitter Card](https://dev.twitter.com/cards/types) metadata support
 - robots.txt linking to XML sitemap (disabled by default, see [Hugo docs](https://gohugo.io/extras/robots-txt/))
-- Basic support for [multi-lingual content](https://gohugo.io/content-management/multilingual/) (added in Hugo 0.17) and user interface translation (i18n)
+- Basic support for [multi-lingual content](https://gohugo.io/content-management/multilingual/) (added in Hugo 0.17) and user interface translation (i18n), including RTL languages like Arabic and Farsi
 - Supports Google, Bing, and Yandex site verification via meta tags
-- Supports Google Analytics (async version), see [Hugo docs](https://gohugo.io/extras/analytics/)
+- Supports GDPR-compliant Google Analytics (script is not even loaded until *after* the user agrees) with configurable consent banner, see [`exampleSite/config.toml`](https://github.com/alanorth/hugo-theme-bootstrap4-blog/blob/master/exampleSite/config.toml)
 - Supports Disqus comments, see [Hugo docs](https://gohugo.io/extras/comments/)
-- Can show a message about cookie usage to the user, see [`exampleSite/config.toml`](https://github.com/alanorth/hugo-theme-bootstrap4-blog/blob/master/exampleSite/config.toml)
+- Allow addition of custom `<head>` code in site's `layouts/partials/head-custom.html` (see [#17](https://github.com/alanorth/hugo-theme-bootstrap4-blog/pull/17))
-- Allow addition of custom `<head>` code in site's `layouts/partial/head-custom.html` (see [#17](https://github.com/alanorth/hugo-theme-bootstrap4-blog/pull/17))
 - Configurable display of summaries of content in list templates.
-- configurable keywords for every post
+- Configurable keywords for every post
+- Supports automatic generation of `<img>` srcsets for images in [page bundles](https://gohugo.io/content-management/page-bundles/) using a [new figure shortcode](https://cpbotha.net/2020/05/02/drop-in-replacement-for-hugo-figure-shortcode-with-responsive-img-srcset/) (falls back to default Hugo behavior of looking up images in the static directory)
 
 ## Usage
 Clone the repository to your site's `themes` directory. Refer to [`exampleSite/config.toml`](https://github.com/alanorth/hugo-theme-bootstrap4-blog/blob/master/exampleSite/config.toml) for recommended configuration values.
@@ -38,7 +38,7 @@ A few suggestions to help you get a good looking site quickly:
 See the source code and structure of [picturingjordan.com](https://github.com/alanorth/picturingjordan.com) to get more ideas.
 
 ## Building (For Developers)
-This theme uses the [Bootstrap](https://getbootstrap.com/) framework. A static version of this is already included, but if you want to bump the version, tweak the style, etc, you'll need to rebuild the assets. Make sure you have NodeJS >= v6 installed, and then run the following from inside the theme's directory:
+This theme uses the [Bootstrap](https://getbootstrap.com/) framework. A static version of this is already included, but if you want to bump the version, tweak the style, etc, you'll need to rebuild the assets. Make sure you have NodeJS >= v10 installed, and then run the following from inside the theme's directory:
 
 ```console
 $ npm install

build/assets.json

@@ -1,5 +0,0 @@
-{
-  "style": "static/css/style.css",
-  "cookieconsentcss": "static/css/cookieconsent.min.css",
-  "cookieconsentjs": "static/js/cookieconsent.min.js"
-}

build/sri.js

@@ -1,23 +0,0 @@
-// Adapted from: https://gist.github.com/jmervine/ae1bace0fe37dce75b90ec3e9592771c
-
-var crypto = require('crypto');
-var fs     = require('fs');
-var assets = require('./assets.json');
-
-var generate384 = function (file) {
-  var enc  = 'utf8';
-  var body = fs.readFileSync(file, { encoding: enc });
-  var hash = crypto.createHash('sha384').update(body, enc);
-  var sha  = hash.digest('base64');
-
-  return 'sha384-' + sha;
-}
-
-for (var asset in assets) {
-  var path = assets[asset];
-  var hash = generate384(path);
-
-  console.log(asset + ' = "' + hash + '"');
-}
-
-// vim: set ts=2 sw=2 et:

data/sri.toml

@@ -1,3 +0,0 @@
-style = "sha384-6+EGfPoOzk/n2DVJSlglKT8TV1TgIMvVcKI73IZgBswLasPBn94KommV6ilJqCXE"
-cookieconsentcss = "sha384-6iYDyQZuuNT7DcPJGXx241czdv2+GDGUcXRiqw1iXrjgYMTorSetxFP3JCMQMwnR"
-cookieconsentjs = "sha384-PDjg2ZdS3khPzd53i18+7tzB32JVQfFMrTXYo21RqPgUmEVAPwIhxOUF/8sP79CS"

exampleSite/config.toml

@@ -6,13 +6,15 @@ title = "Hugo Bootstrap v4 Blog"
 theme = "hugo-theme-bootstrap4-blog"
 # number of posts to show on home/category/tag pages (Default: 10)
 paginate = 5
+# number of words to use for summary on home/category/tag pages (Default: 70)
+summaryLength = 50
 # optionally override the site's footer with custom copyright text
 # copyright = "Except where otherwise noted, content on this site is licensed under a [Creative Commons Attribution 4.0 International license](https://creativecommons.org/licenses/by-sa/4.0/)."
 #googleAnalytics = "UA-123-45"
 #disqusShortname = "XYW"
 
 [permalinks]
-  post = "/:year/:month/:title/"
+  posts = "/:year/:month/:title/"
   page = "/:slug/"
 
 [[menu.sidebar]]
@@ -89,5 +91,7 @@ paginate = 5
 # Languages to render
 #[languages.en]
 #[languages.bg]
+  # Bulgarian date format is dd.mm.yyyy
+  #date_format = "02.01.2006"
 
 # vim: ts=2 sw=2 et

i18n/ar.yaml

@@ -0,0 +1,47 @@
+- id: about
+  translation: "عن المُدَوَّنَة"
+
+- id: home
+  translation: "الصَّفْحَة الرَّئيسِيَّة"
+
+- id: recentPosts
+  translation: "المَنْشورات الأَخِيرَة"
+
+- id: readMore
+  translation: "قِرَاءَة المَزِيد ←"
+
+- id: translations
+  translation: "تَرْجَمَة"
+
+- id: share
+  translation: "شَارِك"
+
+- id: paginatorPrevious
+  translation: "الصَّفْحَة السَّابِقَة"
+
+- id: paginatorNext
+  translation: "الصَّفْحَة التَّالِيَة"
+
+- id: cookieMessage
+  translation: "هذا المَوْقِع يَسْتَخْدِم مَلَفَّات كُوكِيز"
+
+- id: cookieLink
+  translation: ".اعْرَف أَكْثَر"
+
+- id: cookieAccept
+  translation: "!أُوَافِق"
+
+- id: backToTop
+  translation: "العَوْدَة إِلَى الاَعْلَى"
+
+- id: links
+  translation: "الرَِّوَابِط"
+
+- id: authoredBy
+  translation: "الكاتب"
+
+- id: postedIn
+  translation: "في"
+
+- id: comma
+  translation: "،"

i18n/bg.yaml

@@ -28,11 +28,20 @@
 - id: cookieLink
   translation: "Научете повече."
 
-- id: cookieDismiss
+- id: cookieAccept
-  translation: "Разбрах!"
+  translation: "Съгласен съм"
+
+- id: cookieDecline
+  translation: "Не съм съгласен"
 
 - id: backToTop
   translation: "Нагоре"
 
 - id: links
   translation: "Линкове"
+
+- id: authoredBy
+  translation: "от"
+
+- id: postedIn
+  translation: "в"

i18n/de.yaml

@@ -28,11 +28,17 @@
 - id: cookieLink
   translation: "Weitere Informationen"
 
-- id: cookieDismiss
+- id: cookieDecline
-  translation: "OK"
+  translation: "Nicht zustimmen"
 
 - id: backToTop
   translation: "Zurück zum Anfang"
 
 - id: links
   translation: "Links"
+  
+- id: authoredBy
+  translation: "von"
+
+- id: postedIn
+  translation: "in"

i18n/en.yaml

@@ -28,11 +28,23 @@
 - id: cookieLink
   translation: "Learn more."
 
-- id: cookieDismiss
+- id: cookieAccept
-  translation: "Got it!"
+  translation: "Agree"
+
+- id: cookieDecline
+  translation: "Disagree"
 
 - id: backToTop
   translation: "Back to top"
 
 - id: links
   translation: "Links"
+
+- id: authoredBy
+  translation: "by"
+
+- id: postedIn
+  translation: "in"
+
+- id: comma
+  translation: ","

i18n/es.yaml

@@ -28,7 +28,7 @@
 - id: cookieLink
   translation: "Leer más."
 
-- id: cookieDismiss
+- id: cookieAccept
   translation: "Comprendido!"
 
 - id: backToTop

i18n/fa.yaml

@@ -0,0 +1,47 @@
+- id: about
+  translation: "درباره من"
+
+- id: home
+  translation: "صفحه اصلی"
+
+- id: recentPosts
+  translation: "مطالب تازه"
+
+- id: readMore
+  translation: "بیشتر بخوانید ←"
+
+- id: translations
+  translation: "ترجمه"
+
+- id: share
+  translation: "به اشتراک گذاشتن"
+
+- id: paginatorPrevious
+  translation: "صفحه قبلی"
+
+- id: paginatorNext
+  translation: "صفحه بعدی"
+
+- id: cookieMessage
+  translation: "در این سایت از کوکیز استفاده میشود"
+
+- id: cookieLink
+  translation: ".بیشتر بدانید"
+
+- id: cookieAccept
+  translation: "!متوجه شدم"
+
+- id: backToTop
+  translation: "برگشت به بالا"
+
+- id: links
+  translation: "لینکها"
+
+- id: authoredBy
+  translation: "بوسیله"
+
+- id: postedIn
+  translation: "در"
+
+- id: comma
+  translation: "،"

i18n/fr.yaml

@@ -28,7 +28,7 @@
 - id: cookieLink
   translation: "En savoir plus."
 
-- id: cookieDismiss
+- id: cookieAccept
   translation: "J'ai compris !"
 
 - id: backToTop

i18n/id.yaml

@@ -28,7 +28,7 @@
 - id: cookieLink
   translation: "Pelajari"
 
-- id: cookieDismiss
+- id: cookieAccept
   translation: "Paham!"
 
 - id: backToTop

i18n/nl.yaml

@@ -0,0 +1,38 @@
+- id: about
+  translation: "Over ons"
+
+- id: home
+  translation: "Home"
+
+- id: recentPosts
+  translation: "Recente berichten"
+
+- id: readMore
+  translation: "Lees verder →"
+
+- id: translations
+  translation: "Vertalingen"
+
+- id: share
+  translation: "Delen"
+
+- id: paginatorPrevious
+  translation: "Vorige pagina"
+
+- id: paginatorNext
+  translation: "Volgende pagina"
+
+- id: cookieMessage
+  translation: "Deze website gebruikt cookies."
+
+- id: cookieLink
+  translation: "Lees hier meer"
+
+- id: cookieAccept
+  translation: "OK"
+
+- id: backToTop
+  translation: "Terug naar boven"
+
+- id: links
+  translation: "Links"

i18n/no.yaml

@@ -28,7 +28,7 @@
 - id: cookieLink
   translation: "Lær mer."
 
-- id: cookieDismiss
+- id: cookieAccept
   translation: "Greit!"
 
 - id: backToTop

i18n/pt.yaml

@@ -28,5 +28,5 @@
 - id: cookieLink
   translation: "Saiba mais."
 
-- id: cookieDismiss
+- id: cookieAccept
   translation: "Ok!"

i18n/zh-Hant-TW.yaml

@@ -28,7 +28,7 @@
 - id: cookieLink
   translation: "進一步瞭解。"
 
-- id: cookieDismiss
+- id: cookieAccept
   translation: "知道了！"
 
 - id: backToTop

layouts/_default/baseof.html

@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="{{ .Lang }}">
+<html lang="{{ .Lang }}" {{ if or (eq .Lang "ar") (eq .Lang "fa") }}dir="rtl"{{ end }}>
 
   <head>
     {{ partial "head-meta.html" . }}
@@ -12,17 +12,26 @@
 
     <title>{{ block "title" . }}{{ .Site.Title }}{{ end }}</title>
 
+    {{ if or (eq .Lang "ar") (eq .Lang "fa") }}
+    {{ "<!-- RTL -->" | safeHTML }}
+    {{ $styleRtl := resources.Get "css/style.rtl.css" | resources.Fingerprint }}
+    <link href="{{ $styleRtl.Permalink }}" rel="stylesheet"{{ if not .Site.Params.disable_sri }} integrity="{{ $styleRtl.Data.Integrity }}" crossorigin="anonymous"{{ end }}>
+    {{ else }}
     {{ "<!-- combined, minified CSS -->" | safeHTML }}
-    <link href="{{ .Site.BaseURL }}css/style.css" rel="stylesheet"{{ if not .Site.Params.disable_sri }} integrity="{{ .Site.Data.sri.style}}" crossorigin="anonymous"{{ end }}>
+    {{ $style := resources.Get "css/style.css" | resources.Fingerprint }}
-
+    <link href="{{ $style.Permalink }}" rel="stylesheet"{{ if not .Site.Params.disable_sri }} integrity="{{ $style.Data.Integrity }}" crossorigin="anonymous"{{ end }}>
-    {{ if .RSSLink }}
-    {{ "<!-- RSS 2.0 feed -->" | safeHTML }}
-    <link href="{{ .RSSLink }}" rel="alternate" type="application/rss+xml" title="{{ .Site.Title }}" />
     {{ end }}
 
-    {{ template "_internal/google_analytics_async.html" . }}
+    {{ "<!-- minified Font Awesome for SVG icons -->" | safeHTML }}
+    {{ $fontawesome := resources.Get "js/fontawesome.min.js" | resources.Fingerprint }}
+    <script defer src="{{ $fontawesome.Permalink }}" integrity="{{ $fontawesome.Data.Integrity }}" crossorigin="anonymous"></script>
 
-    {{ if .Site.Params.cookie_consent_info_url }}
+    {{ "<!-- RSS 2.0 feed -->" | safeHTML }}
+    {{ with .OutputFormats.Get "rss" -}}
+      {{ printf `<link rel="%s" type="%s" href="%s" title="%s" />` .Rel .MediaType.Type .Permalink $.Site.Title | safeHTML }}
+    {{ end -}}
+
+    {{ if .Site.GoogleAnalytics }}
     {{ partial "cookie-consent.html" . }}
     {{ end }}
 
@@ -50,8 +59,8 @@
     {{ if (ne .Site.Params.header_visible false) }}
     <header class="blog-header">
       <div class="container">
-        <h1 class="blog-title"><a href="{{ .Site.BaseURL }}" rel="home">{{ .Site.Title | safeHTML }}</a></h1>
+        <h1 class="blog-title" dir="auto"><a href="{{ .Site.BaseURL | absURL }}" rel="home">{{ .Site.Title | safeHTML }}</a></h1>
-        {{ if .Site.Params.description }}<p class="lead blog-description">{{ .Site.Params.description | markdownify }}</p>{{ end }}
+        {{ if .Site.Params.description }}<p class="lead blog-description" dir="auto">{{ .Site.Params.description | markdownify }}</p>{{ end }}
       </div>
     </header>
     {{ end }}
@@ -76,7 +85,7 @@
 
     {{ block "footer" . }}
     <footer class="blog-footer">
-      <p>
+      <p dir="auto">
       {{ if .Site.Copyright }}
       {{ .Site.Copyright | markdownify }}
       {{ else }}

layouts/_default/content.html

@@ -2,8 +2,8 @@
 
 <article class="blog-post">
   <header>
-    <h2 class="blog-post-title"><a href="{{ .Permalink }}">{{ .Title | markdownify }}</a></h2>
+    <h2 class="blog-post-title" dir="auto"><a href="{{ .Permalink }}">{{ .Title | markdownify }}</a></h2>
-    <p class="blog-post-meta"><time datetime="{{ .Date.Format "2006-01-02T15:04:05Z07:00" }}">{{ .Date.Format $dateFormat }}</time> by {{ .Params.author | default .Site.Params.author }}{{ if or (.Params.categories) (.Params.tags) }} in {{ partial "meta-terms.html" . }}{{ end }}</p>
+    <p class="blog-post-meta"><time {{ .Date.Format "2006-01-02T15:04:05Z07:00" | printf "datetime=%q" | safeHTMLAttr }}>{{ .Date.Format $dateFormat }}</time> {{ i18n "authoredBy" }} {{ .Params.author | default .Site.Params.author }}{{ if or (.Params.categories) (.Params.tags) }} {{ i18n "postedIn" }} {{ partial "meta-terms.html" . }}{{ end }}</p>
   </header>
   {{ .Content }}
 </article> <!-- /.blog-post -->

layouts/_default/list.html

@@ -4,24 +4,22 @@
   "@context": "http://schema.org",
   "@type": "Blog",
   {{- /* Google recommends the headline be no more than 110 characters */}}
-  "headline": "{{ substr .Site.Title 0 110 }}",
+  "headline": {{ substr .Site.Title 0 110 }},
-  "url" : "{{ printf "%s" .Permalink }}",
+  "url" : {{ printf "%s" .Permalink }},
   "author": {
     "@type": "Person",
-    "name": "{{ .Site.Params.author }}"
+    "name": {{ .Site.Params.author }}
   },
   {{- $ISO8601 := "2006-01-02T15:04:05-07:00" }}
   {{- if not .Date.IsZero }}
-  "dateModified": "{{ .Date.Format $ISO8601 }}",
+  "dateModified": {{ .Date.Format $ISO8601 }},
-  {{- end }}
-  {{- with .Site.Social.GooglePlus }}
-  "publisher": "{{ printf "%s" . }}",
   {{- end }}
   {{- /* all of the site's categories/tags, from Hugo's tpl/template_embedded.go */}}
-  "keywords": "{{ range $plural, $terms := .Site.Taxonomies }}{{ range $term, $val := $terms }}{{ printf "%s," $term }}{{ end }}{{ end }}"
+  {{- $keywords := slice }}{{ range $plural, $terms := .Site.Taxonomies }}{{ range $term, $val := $terms }}{{ $keywords = $keywords | append $term }}{{ end }}{{ end }}
+  "keywords": {{ delimit $keywords ", " }} 
   {{- with .Site.Params.description -}}
   ,
-  "description": "{{- . -}}"
+  "description": {{- . -}}
   {{- end }}
 }
 </script>

layouts/_default/single.html

@@ -6,47 +6,54 @@
   "@context": "http://schema.org",
   "@type": "BlogPosting",
   {{- /* Google recommends the headline be no more than 110 characters */}}
-  "headline": "{{ substr .Title 0 110 }}",
+  "headline": {{ substr .Title 0 110 }},
-  {{- with .Params.images -}}{{ range first 1 . }}
+  {{- with .Params.images -}}{{- range first 1 . -}}
+  {{/* try to get the image from the page bundle */}}
+  {{- with $.Page.Resources.GetMatch (printf "*%s*" .) }}
   "image": {
     "@type": "ImageObject",
-    "url": "{{ . | absURL }}"
+    "url": {{ .Permalink }},
-    {{- /* Don't try to get imageConfig if image param is not local */ -}}
-    {{- if not (or (hasPrefix . "http://") (hasPrefix . "https://")) -}}
-    {{- with (imageConfig (printf "/static/%s" .)) -}}
-    ,
     "height": "{{ .Height }}",
     "width": "{{ .Width }}"
+  {{/* otherwise, get the image from static */}}
+  {{- else }}
+  "image": {
+    "@type": "ImageObject",
+    {{- $image := . -}}
+    {{- /* Don't try to get imageConfig if image param is not local */ -}}
+    {{- if not (or (hasPrefix . "http://") (hasPrefix . "https://")) -}}
+    {{- with (imageConfig (printf "/static/%s" .)) }}
+    "url": {{ $image | absURL }},
+    "height": "{{ .Height }}",
+    "width": "{{ .Width }}"
+    {{- end -}}
     {{- end -}}
   {{ end }}
   },
   {{- end -}}{{ end }}
-  "url": "{{ printf "%s" .Permalink }}",
+  "url": {{ printf "%s" .Permalink }},
   "wordCount": "{{ .WordCount }}",
   {{- $ISO8601 := "2006-01-02T15:04:05-07:00" }}
   {{- if not .PublishDate.IsZero }}
-  "datePublished": "{{ .PublishDate.Format $ISO8601 }}",
+  "datePublished": {{ .PublishDate.Format $ISO8601 }},
   {{- else }}
-  "datePublished": "{{ .Date.Format $ISO8601 }}",
+  "datePublished": {{ .Date.Format $ISO8601 }},
   {{- end }}
   {{- if not .Lastmod.IsZero }}
-  "dateModified": "{{ .Lastmod.Format $ISO8601 }}",
+  "dateModified": {{ .Lastmod.Format $ISO8601 }},
-  {{- end }}
-  {{- with .Site.Social.GooglePlus }}
-  "publisher": "{{ printf "%s" . }}",
   {{- end }}
   "author": {
     "@type": "Person",
-    "name": "{{ .Params.author | default .Site.Params.author }}"
+    "name": {{ .Params.author | default .Site.Params.author }}
   }
   {{- if or (.Params.keywords) (or (.Params.categories) (.Params.tags)) -}}
   ,
-  "keywords": "{{ delimit (union .Params.keywords (union .Params.categories .Params.tags)) ", " }}"
+  "keywords": {{ delimit (union .Params.keywords (union .Params.categories .Params.tags)) ", " }}
   {{- end }}
 
   {{- with .Params.description -}}
   ,
-  "description": "{{ . }}"
+  "description": {{ . }}
   {{- end }}
 }
 </script>
@@ -58,8 +65,10 @@
 
 <article class="blog-post">
   <header>
-    <h2 class="blog-post-title"><a href="{{ .Permalink }}">{{ .Title | markdownify }}</a></h2>
+    <h2 class="blog-post-title" dir="auto"><a href="{{ .Permalink }}">{{ .Title | markdownify }}</a></h2>
-    <p class="blog-post-meta"><time datetime="{{ .Date.Format "2006-01-02T15:04:05Z07:00" }}">{{ .Date.Format $dateFormat }}</time> by {{ .Params.author | default .Site.Params.author }}{{ if or (.Params.categories) (.Params.tags) }} in {{ partial "meta-terms.html" . }}{{ end }}</p>
+    <p class="blog-post-meta">
+{{ if not .PublishDate.IsZero }}<time {{ .Date.Format "2006-01-02T15:04:05Z07:00" | printf "datetime=%q" | safeHTMLAttr }}>{{ .Date.Format $dateFormat }}</time>{{ end }}
+{{ if or (.Params.categories) (.Params.tags) }} {{ i18n "postedIn" }} {{ partial "meta-terms.html" . }}{{ end }}</p>
   </header>
   {{ .Content }}
 

layouts/_default/summary.html

@@ -2,8 +2,8 @@
 
 <article class="blog-post">
   <header>
-    <h2 class="blog-post-title"><a href="{{ .Permalink }}">{{ .Title | markdownify }}</a></h2>
+    <h2 class="blog-post-title" dir="auto"><a href="{{ .Permalink }}">{{ .Title | markdownify }}</a></h2>
-    <p class="blog-post-meta"><time datetime="{{ .Date.Format "2006-01-02T15:04:05Z07:00" }}">{{ .Date.Format $dateFormat }}</time> by {{ .Params.author | default .Site.Params.author }}{{ if or (.Params.categories) (.Params.tags) }} in {{ partial "meta-terms.html" . }}{{ end }}</p>
+    <p class="blog-post-meta"><time {{ .Date.Format "2006-01-02T15:04:05Z07:00" | printf "datetime=%q" | safeHTMLAttr }}>{{ .Date.Format $dateFormat }}</time> {{ i18n "authoredBy" }} {{ .Params.author | default .Site.Params.author }}{{ if or (.Params.categories) (.Params.tags) }} {{ i18n "postedIn" }} {{ partial "meta-terms.html" . }}{{ end }}</p>
   </header>
   {{ .Summary }}
   <a href='{{ .Permalink }}'>{{ i18n "readMore" }}</a>

layouts/partials/cookie-consent.html

@@ -1,26 +1,40 @@
-<link href="{{ .Site.BaseURL }}css/cookieconsent.min.css" rel="stylesheet" type="text/css"{{ if not .Site.Params.disable_sri }} integrity="{{ .Site.Data.sri.cookieconsentcss }}" crossorigin="anonymous"{{ end }}>
+{{ $cookieConsentScript := resources.Get "js/haven.umd.min.js" | resources.Fingerprint }}
-<script src="{{ .Site.BaseURL }}js/cookieconsent.min.js"{{ if not .Site.Params.disable_sri }} integrity="{{ .Site.Data.sri.cookieconsentjs }}" crossorigin="anonymous"{{ end }} async></script>
+<script src="{{ $cookieConsentScript.Permalink }}"{{ if not .Site.Params.disable_sri }} integrity="{{ $cookieConsentScript.Data.Integrity }}" crossorigin="anonymous"{{ end }}></script>
 
 <script>
-window.addEventListener("load", function(){
+Haven.create({
-  window.cookieconsent.initialise({
+    notification: {
-    "palette": {
+        {{ with .Site.Params.cookie_consent_info_url -}}
-      "popup": {
+        policyUrl: {{ . | absURL }},
-        "background": "#428bca",
+        {{- end }}
-        "text": "#ffffff"
+        styles: {
+            background: '#428bca',
+            textColor: '#ffffff',
+            buttonBackgroundColor: '#f71559',
+            buttonTextColor: '#ffffff',
         },
-      "button": {
+    },
-        "background": "#f71559"
+    translations: {
+      {{ .Lang }}: {
+            notification: {
+                policy: '{{ i18n "cookieLink" }}',
+                message: '{{ i18n "cookieMessage" }}',
+                accept: '{{ i18n "cookieAccept" }}',
+                decline: '{{ i18n "cookieDecline" }}',
             }
         },
-    "content": {
-      "message": '{{ i18n "cookieMessage" }}',
-      "dismiss": '{{ i18n "cookieDismiss" }}',
-      "link": '{{ i18n "cookieLink" }}',
-      "href": "{{ .Site.Params.cookie_consent_info_url | absURL}}"
     },
-    "position": "bottom-right"
+    services: [
-  })});
+        {
+            name: 'google-analytics',
+            options: {
+                    id: {{ .Site.GoogleAnalytics }},
+            },
+            purposes: ['analytics'],
+            inject: true,
+        }
+    ]
+});
 </script>
 
 {{- /* vim: set ts=2 sw=2 et: */}}

layouts/partials/head-meta.html

@@ -1,8 +1,8 @@
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 
-{{ template "_internal/opengraph.html" . }}
+{{ partial "opengraph.html" . }}
-{{ template "_internal/twitter_cards.html" . }}
+{{ partial "twitter_cards.html" . }}
 
 {{- with .Site.Params.google_verify_meta -}}
 <meta name="google-site-verification" content="{{ . }}" />
@@ -16,6 +16,6 @@
 <meta name="yandex-verification" content="{{ . }}" />
 {{ end }}
 
-{{- .Hugo.Generator -}}
+{{- .Site.Hugo.Generator -}}
 
 {{- /* vim: set ts=2 sw=2 et: */}}

layouts/partials/meta-terms.html

@@ -1,8 +1,8 @@
 {{ if .Params.categories }}
-<i class="fa fa-folder" aria-hidden="true"></i>&nbsp;{{ range $index, $category := .Params.categories }}{{ if gt $index 0 }}, {{ end }}<a href="{{ "/categories/" | relLangURL }}{{ . | urlize }}" rel="category tag">{{ . }}</a>{{ end }}
+<span class="fas fa-folder" aria-hidden="true"></span>&nbsp;{{ range $index, $category := .Params.categories }}{{ if gt $index 0 }}{{ i18n "comma" }} {{ end }}<a href="{{ "/categories/" | relLangURL }}{{ . | urlize }}/" rel="category tag">{{ . }}</a>{{ end }}
 {{ end }}
 {{ if .Params.tags }}
-<i class="fa fa-tag" aria-hidden="true"></i>&nbsp;{{ range $index, $tag := .Params.tags }}{{ if gt $index 0 }}, {{ end }}<a href="{{ "/tags/" | relLangURL }}{{ . | urlize }}" rel="tag">{{ . }}</a>{{ end }}
+<span class="fas fa-tag" aria-hidden="true"></span>&nbsp;{{ range $index, $tag := .Params.tags }}{{ if gt $index 0 }}{{ i18n "comma" }} {{ end }}<a href="{{ "/tags/" | relLangURL }}{{ . | urlize }}/" rel="tag">{{ . }}</a>{{ end }}
 {{ end }}
 
 {{- /* vim: set ts=2 sw=2 et: */}}

layouts/partials/opengraph.html

@@ -0,0 +1,73 @@
+<!--
+Import Hugo's internal twitter_cards.html template to add support for resolving
+images in page bundles and with falling back to the default of looking in the
+static assets directory.
+
+See: tpl/tplimpl/embedded/templates/opengraph.html
+See: https://github.com/gohugoio/hugo/issues/5078
+-->
+<meta property="og:title" content="{{ .Title }}" />
+<meta property="og:description" content="{{ with .Description }}{{ . }}{{ else }}{{if .IsPage}}{{ .Summary }}{{ else }}{{ with .Site.Params.description }}{{ . }}{{ end }}{{ end }}{{ end }}" />
+<meta property="og:type" content="{{ if .IsPage }}article{{ else }}website{{ end }}" />
+<meta property="og:url" content="{{ .Permalink }}" />
+{{ with $.Params.images }}{{ range first 6 . -}}
+{{/* try to get the image from the page bundle */}}
+{{- with $.Page.Resources.GetMatch (printf "*%s*" .) -}}
+<meta property="og:image" content="{{ .Permalink }}" />
+{{/* otherwise, get the image from /static */}}
+{{- else -}}
+<meta property="og:image" content="{{ . | absURL }}" />
+{{- end }}
+{{ end }}{{ else -}}
+{{- $images := $.Resources.ByType "image" -}}
+{{- $featured := $images.GetMatch "*feature*" -}}
+{{- if not $featured }}{{ $featured = $images.GetMatch "{*cover*,*thumbnail*}" }}{{ end -}}
+{{- with $featured -}}
+<meta property="og:image" content="{{ $featured.Permalink }}"/>
+{{ else -}}
+{{- with $.Site.Params.images -}}
+<meta property="og:image" content="{{ index . 0 | absURL }}"/>
+{{ end }}{{ end }}{{ end }}
+
+{{- $iso8601 := "2006-01-02T15:04:05-07:00" -}}
+{{- if .IsPage }}
+{{- if not .PublishDate.IsZero }}<meta property="article:published_time" {{ .PublishDate.Format $iso8601 | printf "content=%q" | safeHTMLAttr }} />
+{{ else if not .Date.IsZero }}<meta property="article:published_time" {{ .Date.Format $iso8601 | printf "content=%q" | safeHTMLAttr }} />
+{{ end }}
+{{- if not .Lastmod.IsZero }}<meta property="article:modified_time" {{ .Lastmod.Format $iso8601 | printf "content=%q" | safeHTMLAttr }} />{{ end }}
+{{- else }}
+{{- if not .Date.IsZero }}<meta property="og:updated_time" {{ .Lastmod.Format $iso8601 | printf "content=%q" | safeHTMLAttr }} />
+{{- end }}
+{{- end }}{{/* .IsPage */}}
+
+{{- with .Params.audio }}<meta property="og:audio" content="{{ . }}" />{{ end }}
+{{- with .Params.locale }}<meta property="og:locale" content="{{ . }}" />{{ end }}
+{{- with .Site.Params.title }}<meta property="og:site_name" content="{{ . }}" />{{ end }}
+{{- with .Params.videos }}
+{{- range . }}
+<meta property="og:video" content="{{ . | absURL }}" />
+{{ end }}{{ end }}
+
+{{- /* If it is part of a series, link to related articles */}}
+{{- $permalink := .Permalink }}
+{{- $siteSeries := .Site.Taxonomies.series }}{{ with .Params.series }}
+{{- range $name := . }}
+  {{- $series := index $siteSeries $name }}
+  {{- range $page := first 6 $series.Pages }}
+    {{- if ne $page.Permalink $permalink }}<meta property="og:see_also" content="{{ $page.Permalink }}" />{{ end }}
+  {{- end }}
+{{ end }}{{ end }}
+
+{{- if .IsPage }}
+{{- range .Site.Authors }}{{ with .Social.facebook }}
+<meta property="article:author" content="https://www.facebook.com/{{ . }}" />{{ end }}{{ with .Site.Social.facebook }}
+<meta property="article:publisher" content="https://www.facebook.com/{{ . }}" />{{ end }}
+<meta property="article:section" content="{{ .Section }}" />
+{{- with .Params.tags }}{{ range first 6 . }}
+<meta property="article:tag" content="{{ . }}" />{{ end }}{{ end }}
+{{- end }}{{ end }}
+
+{{- /* Facebook Page Admin ID for Domain Insights */}}
+{{- with .Site.Social.facebook_admin }}<meta property="fb:admins" content="{{ . }}" />{{ end }}
+
+

layouts/partials/recent.html

@@ -2,7 +2,7 @@
     <h4>{{ i18n "recentPosts" }}</h4>
     <ol class="list-unstyled">
 {{ $num_recent_posts := (index .Site.Params.sidebar "num_recent_posts" | default 5) }}
-{{ range first $num_recent_posts (where .Site.Pages "Section" "in" .Site.Params.mainSections) }}
+{{ range first $num_recent_posts (where .Site.RegularPages "Section" "in" .Site.Params.mainSections) }}
 <li><a href="{{.RelPermalink}}">{{.Title | markdownify }}</a></li>
 {{ end }}
     </ol>

layouts/partials/sharing-icons.html

@@ -1,10 +1,9 @@
   <section>
     <h4>{{ i18n "share" }}</h4>
     <nav class="nav sharing-icons">
-      <a class="nav-item" href="https://www.facebook.com/sharer/sharer.php?u={{ .Permalink }}" title="Share on Facebook"><span class="fa fa-facebook fa-2x" aria-hidden="true"></span></a>
+      <a class="nav-item" href="https://www.facebook.com/sharer/sharer.php?u={{ .Permalink }}" title="Share on Facebook"><span class="fab fa-facebook-f fa-2x" aria-hidden="true"></span></a>
-      <a class="nav-item" href="https://plus.google.com/share?url={{ .Permalink }}" title="Share on Google+"><span class="fa fa-google-plus fa-2x" aria-hidden="true"></span></a>
+      <a class="nav-item" href="https://www.linkedin.com/shareArticle?mini=true&amp;url={{ .Permalink }}" title="Share on LinkedIn"><span class="fab fa-linkedin-in fa-2x" aria-hidden="true"></span></a>
-      <a class="nav-item" href="https://www.linkedin.com/shareArticle?mini=true&amp;url={{ .Permalink }}" title="Share on LinkedIn"><span class="fa fa-linkedin fa-2x" aria-hidden="true"></span></a>
+      <a class="nav-item" href="https://twitter.com/intent/tweet?url={{ .Permalink }}&amp;text={{ .Title }}" title="Tweet this"><span class="fab fa-twitter fa-2x"></span></a>
-      <a class="nav-item" href="https://twitter.com/home?status={{ .Permalink }}" title="Tweet this"><span class="fa fa-twitter fa-2x"></span></a>
     </nav>
   </section>
 

layouts/partials/sidebar.html

@@ -2,7 +2,7 @@
   {{ if and (.Site.Params.sidebar) (isset .Site.Params.sidebar "about") }}
   <section class="sidebar-module sidebar-module-inset">
     <h4>{{ i18n "about" }}</h4>
-    <p>{{ .Site.Params.sidebar.about | markdownify }}</p>
+    <p dir="auto">{{ .Site.Params.sidebar.about | markdownify }}</p>
   </section>
   {{ end }}
 

layouts/partials/twitter_cards.html

@@ -0,0 +1,42 @@
+<!--
+Import Hugo's internal twitter_cards.html template to add support for resolving
+images in page bundles and with falling back to the default of looking in the
+static assets directory.
+
+See: tpl/tplimpl/embedded/templates/twitter_cards.html
+See: https://github.com/gohugoio/hugo/issues/5078
+-->
+{{- with $.Params.images -}}
+<meta name="twitter:card" content="summary_large_image"/>
+{{/* try to get the image from the page bundle */}}
+{{- with $.Page.Resources.GetMatch (printf "*%s*" .) -}}
+<meta name="twitter:image" content="{{ .Permalink }}"/>
+{{- else -}}
+<meta name="twitter:image" content="{{ index . 0 | absURL }}"/>
+{{- end -}}
+{{ else -}}
+{{- $images := $.Resources.ByType "image" -}}
+{{- $featured := $images.GetMatch "*feature*" -}}
+{{- if not $featured }}{{ $featured = $images.GetMatch "{*cover*,*thumbnail*}" }}{{ end -}}
+{{- with $featured -}}
+<meta name="twitter:card" content="summary_large_image"/>
+<meta name="twitter:image" content="{{ $featured.Permalink }}"/>
+{{- else -}}
+{{- with $.Site.Params.images -}}
+<meta name="twitter:card" content="summary_large_image"/>
+<meta name="twitter:image" content="{{ index . 0 | absURL }}"/>
+{{ else -}}
+<meta name="twitter:card" content="summary"/>
+{{- end -}}
+{{- end -}}
+{{- end }}
+<meta name="twitter:title" content="{{ .Title }}"/>
+<meta name="twitter:description" content="{{ with .Description }}{{ . }}{{ else }}{{if .IsPage}}{{ .Summary }}{{ else }}{{ with .Site.Params.description }}{{ . }}{{ end }}{{ end }}{{ end -}}"/>
+{{ with .Site.Social.twitter -}}
+<meta name="twitter:site" content="@{{ . }}"/>
+{{ end -}}
+{{ range .Site.Authors }}
+{{ with .twitter -}}
+<meta name="twitter:creator" content="@{{ . }}"/>
+{{ end -}}
+{{ end -}}

layouts/robots.txt

@@ -1,3 +1,3 @@
-Sitemap: {{ .Site.BaseURL }}sitemap.xml
+Sitemap: {{ "sitemap.xml" | absURL }}
 
 User-agent: *

layouts/shortcodes/figure.html

@@ -0,0 +1,92 @@
+{{/*
+
+figure with auto-resizing and srcset v2020-11-30
+
+Drop-in replacement for Hugo's figure shortcode as of 2020-05-02 that uses img srcset
+to enable browsers to download only the resolution that they need.
+
+The resizing and srcset magic only works for images that are part of the page
+bundle. It will fall back to stock Hugo figure behaviour otherwise.
+
+Improvements that were initially out of reach of my Hugo template programming "skills"
+but have now been taken care of:
+- [x] gracefully handle images that are not in page bundle, i.e. no image processing available
+- [x] use a single configurable sizes array, and derive everything from there
+
+See https://cpbotha.net/2020/05/02/drop-in-replacement-for-hugo-figure-shortcode-with-img-srcset-support/
+
+- original srcset img shortcode from: https://laurakalbag.com/processing-responsive-images-with-hugo/
+- original hugo figure shortcode from: https://github.com/gohugoio/hugo/blob/master/tpl/tplimpl/embedded/templates/shortcodes/figure.html
+- no unnecessary resizes and more nudges by Stéfan van der Walt https://mentat.za.net/
+- mashing together and srcset logic fixes by Charl P. Botha https://cpbotha.net/
+
+Changes:
+- 2020-11-30 handle images that are rotated 90 degrees (should handle more eventually)
+- 2020-05-10 fall back to stock Hugo behaviour when no page bundle found
+- 2020-05-04 no unnecessary resizes, sizes in array
+- 2020-05-02 initial release
+
+*/}}
+
+{{/* hugo will resize to all of these sizes that are smaller than your original. configure if you like! */}}
+{{ $sizes := (slice "480" "800" "1200" "1500") }}
+
+{{/* get file that matches the filename as specified as src="" in shortcode */}}
+{{ $src := .Page.Resources.GetMatch (printf "*%s*" (.Get "src")) }}
+
+<figure{{ with .Get "class" }} class="{{ . }}"{{ end }}>
+    {{- if .Get "link" -}}
+        <a href="{{ .Get "link" }}"{{ with .Get "target" }} target="{{ . }}"{{ end }}{{ with .Get "rel" }} rel="{{ . }}"{{ end }}>
+    {{- end }}
+    <img
+        {{ if $src }}
+            sizes="(min-width: 35em) 1200px, 100vw"
+            {{/* only srcset images smaller than or equal to the src (original) image size, as Hugo will upscale small images */}}  
+            srcset='
+            {{ range $sizes }}
+                   {{ $size := . }}
+                   {{/* https://discourse.gohugo.io/t/image-exif-orientation/22902/7 */}}
+                   {{/* set orientation to 1 just in case it doesnt exist in Exif */}}
+                   {{ $orientation := 1 }}
+                   {{ with $src.Exif }}
+                   {{ $orientation := .Tags.Orientation }}
+                   {{ if and (ge $src.Width $size) (eq $orientation 8) }}
+                       {{ ($src.Resize (printf "%sx r90" $size)).Permalink }} {{ (printf "%sw" $size) }},
+                   {{ else if ge $src.Width $size }}{{ ($src.Resize (printf "%sx" $size)).Permalink }} {{ (printf "%sw" $size) }},{{ end }}
+                   {{ end }}
+            {{ end }}'
+
+            {{/* when no support for srcset (old browsers, RSS), we load small (800px) */}}
+            {{/* if image smaller than 800, then load the image itself */}}
+            {{ if ge $src.Width "800" }}src="{{ ($src.Resize "800x").Permalink }}"
+            {{ else }}src="{{ $src.Permalink }}"
+            {{ end }}
+
+        {{ else }}
+            {{/* fall back to stock hugo behaviour when image is not available in bundle */}}
+            src="{{ .Get "src" }}"
+        {{ end }}
+
+        {{- if or (.Get "alt") (.Get "caption") }}
+            alt="{{ with .Get "alt" }}{{ . }}{{ else }}{{ .Get "caption" | markdownify| plainify }}{{ end }}"
+        {{- end -}}
+        {{- with .Get "width" }} width="{{ . }}"{{ end -}}
+        {{- with .Get "height" }} height="{{ . }}"{{ end -}}
+    /> <!-- Closing img tag -->
+    {{- if .Get "link" }}</a>{{ end -}}
+    {{- if or (or (.Get "title") (.Get "caption")) (.Get "attr") -}}
+        <figcaption>
+            {{ with (.Get "title") -}}
+                <h4>{{ . }}</h4>
+            {{- end -}}
+            {{- if or (.Get "caption") (.Get "attr") -}}<p>
+                {{- .Get "caption" | markdownify -}}
+                {{- with .Get "attrlink" }}
+                    <a href="{{ . }}">
+                {{- end -}}
+                {{- .Get "attr" | markdownify -}}
+                {{- if .Get "attrlink" }}</a>{{ end }}</p>
+            {{- end }}
+        </figcaption>
+    {{- end }}
+</figure>

package.json

@@ -1,27 +1,31 @@
 {
   "name": "hugo-theme-bootstrap4-blog",
-  "version": "1.1.7",
+  "version": "1.6.0",
   "description": "A Bootstrap v4 theme for the Hugo static site generator.",
   "repository": {
     "type": "git",
     "url": "https://github.com/alanorth/hugo-theme-bootstrap4-blog.git"
   },
   "scripts": {
-    "build:css": "node-sass --output-style expanded --precision 6 source/scss/style.scss static/css/style.css.tmp && cleancss --level 1 static/css/style.css.tmp -o static/css/style.css",
+    "build:css": "sass --style expanded source/scss/style.scss assets/css/style.css.tmp && cleancss --level 1 assets/css/style.css.tmp -o assets/css/style.css",
-    "build:fonts": "cp node_modules/font-awesome/fonts/* static/fonts",
+    "build:rtlcss": "rtlcss -s assets/css/style.css.tmp assets/css/style.rtl.css.tmp && cleancss --level 1 assets/css/style.rtl.css.tmp -o assets/css/style.rtl.css",
-    "build:cookieconsent": "cp node_modules/cookieconsent/build/cookieconsent.min.css static/css && cp node_modules/cookieconsent/build/cookieconsent.min.js static/js",
+    "build:cookieconsent": "cp node_modules/@chiiya/haven/dist/haven.umd.min.js assets/js",
-    "build:generatesri": "node build/sri.js > data/sri.toml",
+    "build:js": "npx webpack",
-    "build": "npm run build:css && npm run build:fonts && npm run build:cookieconsent && npm run build:generatesri && npm run clean",
+    "build": "npm run build:css && npm run build:rtlcss && npm run build:js && npm run build:cookieconsent && npm run clean",
-    "clean": "rm static/css/style.css.tmp"
+    "clean": "rm assets/css/style.css.tmp assets/css/style.css.tmp.map assets/css/style.rtl.css.tmp"
   },
   "keywords": "hugo",
   "author": "Alan Orth",
   "license": "CC-BY-3.0",
   "devDependencies": {
-    "bootstrap": "4.1.3",
+    "@chiiya/haven": "^0.6.2",
-    "clean-css-cli": "^4.2.1",
+    "@fortawesome/fontawesome-svg-core": "^1.2.34",
-    "cookieconsent": "3.0.4",
+    "@fortawesome/free-brands-svg-icons": "^5.15.2",
-    "font-awesome": "^4.7.0",
+    "@fortawesome/free-solid-svg-icons": "^5.15.2",
-    "node-sass": "^4.9.3"
+    "bootstrap": "^4.6.0",
+    "clean-css-cli": "^4.3.0",
+    "rtlcss": "^2.6.2",
+    "sass": "^1.32.4",
+    "webpack-cli": "^4.5.0"
   }
 }

source/js/fontawesome.js

@@ -0,0 +1,13 @@
+import { library, dom } from '@fortawesome/fontawesome-svg-core'
+import { faFolder, faTag } from '@fortawesome/free-solid-svg-icons'
+import { faFacebookF, faTwitter, faLinkedinIn } from '@fortawesome/free-brands-svg-icons'
+
+// Add solid icons to our library
+library.add(faFolder, faTag)
+
+// Add brand icons to our library
+library.add(faFacebookF, faTwitter, faLinkedinIn)
+
+// Replace any existing <i> tags with <svg> and set up a MutationObserver to
+// continue doing this as the DOM changes.
+dom.watch()

source/scss/bootstrap.scss

@@ -1,42 +1,44 @@
 /*!
- * Bootstrap v4.1.3 (https://getbootstrap.com/)
+ * Bootstrap v4.6.0 (https://getbootstrap.com/)
- * Copyright 2011-2018 The Bootstrap Authors
+ * Copyright 2011-2021 The Bootstrap Authors
- * Copyright 2011-2018 Twitter, Inc.
+ * Copyright 2011-2021 Twitter, Inc.
- * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
  */
 
-@import "node_modules/bootstrap/scss/functions";
+@import "../../node_modules/bootstrap/scss/functions";
-@import "node_modules/bootstrap/scss/variables";
+@import "../../node_modules/bootstrap/scss/variables";
-@import "node_modules/bootstrap/scss/mixins";
+@import "../../node_modules/bootstrap/scss/mixins";
-//@import "node_modules/bootstrap/scss/root";
+@import "../../node_modules/bootstrap/scss/root";
-@import "node_modules/bootstrap/scss/reboot";
+@import "../../node_modules/bootstrap/scss/reboot";
-@import "node_modules/bootstrap/scss/type";
+@import "../../node_modules/bootstrap/scss/type";
-@import "node_modules/bootstrap/scss/images";
+@import "../../node_modules/bootstrap/scss/images";
-@import "node_modules/bootstrap/scss/code";
+@import "../../node_modules/bootstrap/scss/code";
-@import "node_modules/bootstrap/scss/grid";
+@import "../../node_modules/bootstrap/scss/grid";
-//@import "node_modules/bootstrap/scss/tables";
+//@import "../../node_modules/bootstrap/scss/tables";
-@import "node_modules/bootstrap/scss/forms";
+@import "../../node_modules/bootstrap/scss/forms";
-@import "node_modules/bootstrap/scss/buttons";
+@import "../../node_modules/bootstrap/scss/buttons";
-//@import "node_modules/bootstrap/scss/transitions";
+//@import "../../node_modules/bootstrap/scss/transitions";
-//@import "node_modules/bootstrap/scss/dropdown";
+//@import "../../node_modules/bootstrap/scss/dropdown";
-//@import "node_modules/bootstrap/scss/button-group";
+//@import "../../node_modules/bootstrap/scss/button-group";
-//@import "node_modules/bootstrap/scss/input-group";
+//@import "../../node_modules/bootstrap/scss/input-group";
-//@import "node_modules/bootstrap/scss/custom-forms";
+//@import "../../node_modules/bootstrap/scss/custom-forms";
-@import "node_modules/bootstrap/scss/nav";
+@import "../../node_modules/bootstrap/scss/nav";
-@import "node_modules/bootstrap/scss/navbar";
+@import "../../node_modules/bootstrap/scss/navbar";
-//@import "node_modules/bootstrap/scss/card";
+//@import "../../node_modules/bootstrap/scss/card";
-//@import "node_modules/bootstrap/scss/breadcrumb";
+//@import "../../node_modules/bootstrap/scss/breadcrumb";
-@import "node_modules/bootstrap/scss/pagination";
+@import "../../node_modules/bootstrap/scss/pagination";
-//@import "node_modules/bootstrap/scss/badge";
+//@import "../../node_modules/bootstrap/scss/badge";
-//@import "node_modules/bootstrap/scss/jumbotron";
+//@import "../../node_modules/bootstrap/scss/jumbotron";
-//@import "node_modules/bootstrap/scss/alert";
+//@import "../../node_modules/bootstrap/scss/alert";
-//@import "node_modules/bootstrap/scss/progress";
+//@import "../../node_modules/bootstrap/scss/progress";
-//@import "node_modules/bootstrap/scss/media";
+//@import "../../node_modules/bootstrap/scss/media";
-//@import "node_modules/bootstrap/scss/list-group";
+//@import "../../node_modules/bootstrap/scss/list-group";
-//@import "node_modules/bootstrap/scss/close";
+//@import "../../node_modules/bootstrap/scss/close";
-//@import "node_modules/bootstrap/scss/modal";
+//@import "../../node_modules/bootstrap/scss/toasts";
-//@import "node_modules/bootstrap/scss/tooltip";
+//@import "../../node_modules/bootstrap/scss/modal";
-//@import "node_modules/bootstrap/scss/popover";
+//@import "../../node_modules/bootstrap/scss/tooltip";
-//@import "node_modules/bootstrap/scss/carousel";
+//@import "../../node_modules/bootstrap/scss/popover";
-@import "node_modules/bootstrap/scss/utilities";
+//@import "../../node_modules/bootstrap/scss/carousel";
-@import "node_modules/bootstrap/scss/print";
+//@import "../../node_modules/bootstrap/scss/spinners";
+@import "../../node_modules/bootstrap/scss/utilities";
+@import "../../node_modules/bootstrap/scss/print";

source/scss/font-awesome.scss

@@ -1,35 +0,0 @@
-/*!
- *  Font Awesome 4.7.0 by @davegandy - http://fontawesome.io - @fontawesome
- *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
- */
-
-@import "node_modules/font-awesome/scss/variables";
-@import "node_modules/font-awesome/scss/mixins";
-@import "node_modules/font-awesome/scss/path";
-@import "node_modules/font-awesome/scss/core";
-@import "node_modules/font-awesome/scss/larger";
-@import "node_modules/font-awesome/scss/fixed-width";
-//@import "list";
-//@import "bordered-pulled";
-//@import "animated";
-//@import "rotated-flipped";
-//@import "stacked";
-//@import "icons";
-// selectively import icons we need from font-awesome
-// see: node_modules/font-awesome/scss/_icons.scss
-.#{$fa-css-prefix}-tag:before { content: $fa-var-tag; }
-.#{$fa-css-prefix}-folder:before { content: $fa-var-folder; }
-.#{$fa-css-prefix}-facebook:before { content: $fa-var-facebook; }
-.#{$fa-css-prefix}-google-plus:before { content: $fa-var-google-plus; }
-.#{$fa-css-prefix}-linkedin:before { content: $fa-var-linkedin; }
-.#{$fa-css-prefix}-rss:before { content: $fa-var-rss; }
-.#{$fa-css-prefix}-rss-square:before { content: $fa-var-rss-square; }
-.#{$fa-css-prefix}-twitter:before { content: $fa-var-twitter; }
-.#{$fa-css-prefix}-y-combinator-square:before,
-.#{$fa-css-prefix}-yc-square:before,
-.#{$fa-css-prefix}-hacker-news:before { content: $fa-var-hacker-news; }
-.#{$fa-css-prefix}-reddit:before { content: $fa-var-reddit; }
-.#{$fa-css-prefix}-reddit-square:before { content: $fa-var-reddit-square; }
-.#{$fa-css-prefix}-stumbleupon-circle:before { content: $fa-var-stumbleupon-circle; }
-.#{$fa-css-prefix}-stumbleupon:before { content: $fa-var-stumbleupon; }
-@import "node_modules/font-awesome/scss/screen-reader";

source/scss/style.scss

@@ -1,10 +1,6 @@
-// selectively import components we need from font-awesome
-// see: node_modules/font-awesome/scss/font-awesome.scss
-@import 'source/scss/font-awesome';
-
 // selectively import components we need from bootstrap
 // see: node_modules/bootstrap/scss/bootstrap.scss
-@import 'source/scss/bootstrap';
+@import 'bootstrap';
 
 // local style overrides
-@import 'source/scss/main';
+@import 'main';

static/css/cookieconsent.min.css

@@ -1,6 +0,0 @@
-.cc-window{opacity:1;transition:opacity 1s ease}.cc-window.cc-invisible{opacity:0}.cc-animate.cc-revoke{transition:transform 1s ease}.cc-animate.cc-revoke.cc-top{transform:translateY(-2em)}.cc-animate.cc-revoke.cc-bottom{transform:translateY(2em)}.cc-animate.cc-revoke.cc-active.cc-bottom,.cc-animate.cc-revoke.cc-active.cc-top,.cc-revoke:hover{transform:translateY(0)}.cc-grower{max-height:0;overflow:hidden;transition:max-height 1s}
-.cc-link,.cc-revoke:hover{text-decoration:underline}.cc-revoke,.cc-window{position:fixed;overflow:hidden;box-sizing:border-box;font-family:Helvetica,Calibri,Arial,sans-serif;font-size:16px;line-height:1.5em;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;z-index:9999}.cc-window.cc-static{position:static}.cc-window.cc-floating{padding:2em;max-width:24em;-ms-flex-direction:column;flex-direction:column}.cc-window.cc-banner{padding:1em 1.8em;width:100%;-ms-flex-direction:row;flex-direction:row}.cc-revoke{padding:.5em}.cc-header{font-size:18px;font-weight:700}.cc-btn,.cc-close,.cc-link,.cc-revoke{cursor:pointer}.cc-link{opacity:.8;display:inline-block;padding:.2em}.cc-link:hover{opacity:1}.cc-link:active,.cc-link:visited{color:initial}.cc-btn{display:block;padding:.4em .8em;font-size:.9em;font-weight:700;border-width:2px;border-style:solid;text-align:center;white-space:nowrap}.cc-banner .cc-btn:last-child{min-width:140px}.cc-highlight .cc-btn:first-child{background-color:transparent;border-color:transparent}.cc-highlight .cc-btn:first-child:focus,.cc-highlight .cc-btn:first-child:hover{background-color:transparent;text-decoration:underline}.cc-close{display:block;position:absolute;top:.5em;right:.5em;font-size:1.6em;opacity:.9;line-height:.75}.cc-close:focus,.cc-close:hover{opacity:1}
-.cc-revoke.cc-top{top:0;left:3em;border-bottom-left-radius:.5em;border-bottom-right-radius:.5em}.cc-revoke.cc-bottom{bottom:0;left:3em;border-top-left-radius:.5em;border-top-right-radius:.5em}.cc-revoke.cc-left{left:3em;right:unset}.cc-revoke.cc-right{right:3em;left:unset}.cc-top{top:1em}.cc-left{left:1em}.cc-right{right:1em}.cc-bottom{bottom:1em}.cc-floating>.cc-link{margin-bottom:1em}.cc-floating .cc-message{display:block;margin-bottom:1em}.cc-window.cc-floating .cc-compliance{-ms-flex:1;flex:1}.cc-window.cc-banner{-ms-flex-align:center;align-items:center}.cc-banner.cc-top{left:0;right:0;top:0}.cc-banner.cc-bottom{left:0;right:0;bottom:0}.cc-banner .cc-message{-ms-flex:1;flex:1}.cc-compliance{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-line-pack:justify;align-content:space-between}.cc-compliance>.cc-btn{-ms-flex:1;flex:1}.cc-btn+.cc-btn{margin-left:.5em}
-@media print{.cc-revoke,.cc-window{display:none}}@media screen and (max-width:900px){.cc-btn{white-space:normal}}@media screen and (max-width:414px) and (orientation:portrait),screen and (max-width:736px) and (orientation:landscape){.cc-window.cc-top{top:0}.cc-window.cc-bottom{bottom:0}.cc-window.cc-banner,.cc-window.cc-left,.cc-window.cc-right{left:0;right:0}.cc-window.cc-banner{-ms-flex-direction:column;flex-direction:column}.cc-window.cc-banner .cc-compliance{-ms-flex:1;flex:1}.cc-window.cc-floating{max-width:none}.cc-window .cc-message{margin-bottom:1em}.cc-window.cc-banner{-ms-flex-align:unset;align-items:unset}}
-.cc-floating.cc-theme-classic{padding:1.2em;border-radius:5px}.cc-floating.cc-type-info.cc-theme-classic .cc-compliance{text-align:center;display:inline;-ms-flex:none;flex:none}.cc-theme-classic .cc-btn{border-radius:5px}.cc-theme-classic .cc-btn:last-child{min-width:140px}.cc-floating.cc-type-info.cc-theme-classic .cc-btn{display:inline-block}
-.cc-theme-edgeless.cc-window{padding:0}.cc-floating.cc-theme-edgeless .cc-message{margin:2em 2em 1.5em}.cc-banner.cc-theme-edgeless .cc-btn{margin:0;padding:.8em 1.8em;height:100%}.cc-banner.cc-theme-edgeless .cc-message{margin-left:1em}.cc-floating.cc-theme-edgeless .cc-btn+.cc-btn{margin-left:0}

theme.toml

@@ -1,15 +1,15 @@
 name = "Hugo Bootstrap v4 Blog"
 license = "CC-BY-3.0"
-licenselink = "https://github.com/alanorth/hugo-theme-bootstrap4/blob/master/LICENSE.txt"
+licenselink = "https://github.com/alanorth/hugo-theme-bootstrap4-blog/blob/master/LICENSE.txt"
 description = "A simple Hugo theme based on the Bootstrap v4 blog example."
-homepage = "https://github.com/alanorth/hugo-theme-bootstrap4"
+homepage = "https://github.com/alanorth/hugo-theme-bootstrap4-blog"
 tags = ["bootstrap", "blog", "font awesome"]
 features = ["responsive", "blog"]
-min_version = 0.25
+min_version = 0.55
 
 [author]
   name = "Alan Orth"
-  homepage = "https://englishbulgaria.net"
+  homepage = "https://picturingjordan.com"
 
 [original]
   author = "mdo"

webpack.config.js

@@ -0,0 +1,10 @@
+const path = require('path');
+
+module.exports = {
+    entry: './source/js/fontawesome.js',
+    output: {
+            path: path.resolve(__dirname, 'assets/js'),
+            filename: 'fontawesome.min.js'
+          },
+    mode: 'production'
+};