🔖 Release v2.4.2

CHANGELOG.md

@@ -6,6 +6,23 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ## [Unreleased]
 
+## [2.4.2] - 2022-11-22
+
+### Added
+
+- Dutch translation ([#371](https://github.com/jpanther/congo/pull/371))
+- HTML `theme-color` meta tag to adjust browser colours according to the active Congo colour scheme ([#379](https://github.com/jpanther/congo/pull/379))
+
+### Changed
+
+- Extended head and footer partials are no longer cached during builds
+- Upgrade to Chart.js v4.0.1 ([#373](https://github.com/jpanther/congo/pull/373))
+
+### Fixed
+
+- Code highlight background cut off when overflowing content area ([#374](https://github.com/jpanther/congo/issues/374))
+- 'Description' HTML meta tag not set from article description ([#378](https://github.com/jpanther/congo/issues/378))
+
 ## [2.4.1] - 2022-11-14
 
 ### Changed
@@ -553,7 +570,8 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 - Advanced customisation using simple Tailwind colour definitions and styles
 - Fully documented
 
-[unreleased]: https://github.com/jpanther/congo/compare/v2.4.1...HEAD
+[unreleased]: https://github.com/jpanther/congo/compare/v2.4.2...HEAD
+[2.4.2]: https://github.com/jpanther/congo/compare/v2.4.1...v2.4.2
 [2.4.1]: https://github.com/jpanther/congo/compare/v2.4.0...v2.4.1
 [2.4.0]: https://github.com/jpanther/congo/compare/v2.3.1...v2.4.0
 [2.3.1]: https://github.com/jpanther/congo/compare/v2.3.0...v2.3.1

assets/css/compiled/main.css

@@ -1,4 +1,4 @@
-/*! Congo v2.4.1 | MIT License | https://github.com/jpanther/congo */
+/*! Congo v2.4.2 | MIT License | https://github.com/jpanther/congo */
 
 /*! tailwindcss v3.2.4 | MIT License | https://tailwindcss.com */
 
@@ -1194,6 +1194,7 @@ body:has(#menu-controller:checked) {
 .chroma .lntd,
 .chroma .lntd pre {
   margin: 0px;
+  overflow: hidden;
   border-style: none;
   padding: 0px;
   vertical-align: top;
@@ -1204,9 +1205,7 @@ body:has(#menu-controller:checked) {
 .chroma .lntable {
   display: block;
   width: auto;
-  overflow: hidden;
+  overflow-x: auto;
-  padding-left: 1rem;
-  padding-right: 1rem;
   padding-top: 0.75rem;
   padding-bottom: 0.75rem;
   font-size: 1rem;
@@ -1214,17 +1213,19 @@ body:has(#menu-controller:checked) {
   border-spacing: 0;
 }
 
+/* LineTable Line */
+
+.chroma .lntable .line {
+  padding-right: 1rem;
+}
+
 /* LineHighlight */
 
 .chroma .hl {
-  margin-left: -1rem;
-  margin-right: -1rem;
   display: block;
   width: auto;
   --tw-bg-opacity: 1;
   background-color: rgba(var(--color-primary-100), var(--tw-bg-opacity));
-  padding-left: 1rem;
-  padding-right: 1rem;
 }
 
 .dark .chroma .hl {
@@ -1232,11 +1233,6 @@ body:has(#menu-controller:checked) {
   background-color: rgba(var(--color-primary-900), var(--tw-bg-opacity));
 }
 
-.chroma .lntd .hl {
-  margin: 0px;
-  padding: 0px;
-}
-
 /* LineNumbersTable */
 
 /* LineNumbers */

assets/css/main.css

@@ -1,4 +1,4 @@
-/*! Congo v2.4.1 | MIT License | https://github.com/jpanther/congo */
+/*! Congo v2.4.2 | MIT License | https://github.com/jpanther/congo */
 
 @tailwind base;
 @tailwind components;
@@ -34,11 +34,11 @@ body:has(#menu-controller:checked) {
 
 /* RTL support */
 .prose blockquote {
-  @apply rtl:pr-4 rtl:border-l-0 rtl:border-r-4;
+  @apply rtl:border-l-0 rtl:border-r-4 rtl:pr-4;
 }
 .prose ul > li,
 .prose ol > li {
-  @apply rtl:pl-0 rtl:pr-2 rtl:mr-7;
+  @apply rtl:mr-7 rtl:pl-0 rtl:pr-2;
 }
 .prose ol > li:before,
 .prose ul > li:before {
@@ -84,7 +84,7 @@ body:has(#menu-controller:checked) {
   @apply visible;
 }
 .copy-button {
-  @apply absolute top-0 right-0 z-10 invisible w-20 py-1 font-mono text-sm cursor-pointer opacity-90 bg-neutral-200 whitespace-nowrap rounded-bl-md rounded-tr-md text-neutral-700 dark:bg-neutral-600 dark:text-neutral-200;
+  @apply absolute top-0 right-0 z-10 invisible w-20 py-1 font-mono text-sm cursor-pointer whitespace-nowrap rounded-bl-md rounded-tr-md bg-neutral-200 text-neutral-700 opacity-90 dark:bg-neutral-600 dark:text-neutral-200;
 }
 .copy-button:hover,
 .copy-button:focus,
@@ -93,36 +93,37 @@ body:has(#menu-controller:checked) {
   @apply bg-primary-100 dark:bg-primary-600;
 }
 .copy-textarea {
-  @apply absolute opacity-5 -z-10;
+  @apply absolute -z-10 opacity-5;
 }
 
 /* -- Chroma Highlight -- */
 /* Background */
 .prose .chroma {
-  @apply static rounded-md text-neutral-700 bg-neutral-50 dark:bg-neutral-700 dark:text-neutral-200;
+  @apply static rounded-md bg-neutral-50 text-neutral-700 dark:bg-neutral-700 dark:text-neutral-200;
 }
 /* LineTableTD */
 .chroma .lntd,
 .chroma .lntd pre {
-  @apply p-0 m-0 align-top border-none;
+  @apply p-0 m-0 overflow-hidden align-top border-none;
 }
 /* LineTable */
 .chroma .lntable {
-  @apply block w-auto px-4 py-3 overflow-hidden text-base;
+  @apply block w-auto py-3 overflow-x-auto text-base;
   border-spacing: 0;
 }
+/* LineTable Line */
+.chroma .lntable .line {
+  @apply pr-4;
+}
 /* LineHighlight */
 .chroma .hl {
-  @apply block w-auto px-4 -mx-4 bg-primary-100 dark:bg-primary-900;
+  @apply block w-auto bg-primary-100 dark:bg-primary-900;
-}
-.chroma .lntd .hl {
-  @apply p-0 m-0;
 }
 /* LineNumbersTable */
 /* LineNumbers */
 .chroma .lnt,
 .chroma .ln {
-  @apply text-neutral-600 dark:text-neutral-300  mr-[0.4em] px-[0.4em] py-0;
+  @apply mr-[0.4em] px-[0.4em] py-0 text-neutral-600 dark:text-neutral-300;
 }
 /* Keyword */
 /* KeywordDeclaration */

assets/js/appearance.js

@@ -1,8 +1,22 @@
 const sitePreference = document.documentElement.getAttribute("data-default-appearance");
 const userPreference = localStorage.getItem("appearance");
 
+function getCSSValue(varName) {
+  var cssValue = window.getComputedStyle(document.documentElement).getPropertyValue(varName);
+  return "rgb(" + cssValue.replace(/\s+/g, "") + ")";
+}
+
+function setThemeColor() {
+  var metaThemeColor = document.querySelector("meta[name=theme-color]");
+  document.documentElement.classList.contains("dark")
+    ? metaThemeColor.setAttribute("content", getCSSValue("--color-neutral-800"))
+    : metaThemeColor.setAttribute("content", getCSSValue("--color-neutral"));
+  return true;
+}
+
 if ((sitePreference === "dark" && userPreference === null) || userPreference === "dark") {
   document.documentElement.classList.add("dark");
+  setThemeColor();
 }
 
 if (document.documentElement.getAttribute("data-auto-appearance") === "true") {
@@ -12,6 +26,7 @@ if (document.documentElement.getAttribute("data-auto-appearance") === "true") {
     userPreference !== "light"
   ) {
     document.documentElement.classList.add("dark");
+    setThemeColor();
   }
   window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", (event) => {
     if (event.matches) {
@@ -19,6 +34,7 @@ if (document.documentElement.getAttribute("data-auto-appearance") === "true") {
     } else {
       document.documentElement.classList.remove("dark");
     }
+    setThemeColor();
   });
 }
 
@@ -27,6 +43,7 @@ window.addEventListener("DOMContentLoaded", (event) => {
   if (switcher) {
     switcher.addEventListener("click", () => {
       document.documentElement.classList.toggle("dark");
+      setThemeColor();
       localStorage.setItem(
         "appearance",
         document.documentElement.classList.contains("dark") ? "dark" : "light"

exampleSite/content/docs/configuration.md

@@ -45,26 +45,27 @@ Note that the variable names provided in this table use dot notation to simplify
 
 Congo is optimised for full multilingual websites and theme assets are translated into several languages out of the box. The language configuration allows you to generate multiple versions of your content to provide a customised experience to your visitors in their native language.
 
-The theme currently supports the following languages by default:
+The theme currently supports the following languages out of the box:
 
-| Language                              | Code    |
+| Language                                | Code    |
-| ------------------------------------- | ------- |
+| --------------------------------------- | ------- |
-| :gb: English                          | `en`    |
+| :gb: **English (default)**              | `en`    |
-| :bangladesh: Bengali                  | `bn`    |
+| :bangladesh: Bengali                    | `bn`    |
-| :cn: Simplified Chinese (China)       | `zh-cn` |
+| :cn: Chinese - Simplified (China)       | `zh-cn` |
-| :taiwan: Traditional Chinese (Taiwan) | `zh-tw` |
+| :taiwan: Chinese - Traditional (Taiwan) | `zh-tw` |
-| :finland: Finnish                     | `fi`    |
+| :netherlands: Dutch                     | `nl`    |
-| :fr: French                           | `fr`    |
+| :finland: Finnish                       | `fi`    |
-| :de: German                           | `de`    |
+| :fr: French                             | `fr`    |
-| :israel: Hebrew                       | `he`    |
+| :de: German                             | `de`    |
-| :hungary: Hungarian                   | `hu`    |
+| :israel: Hebrew                         | `he`    |
-| :it: Italian                          | `it`    |
+| :hungary: Hungarian                     | `hu`    |
-| :jp: Japanese                         | `ja`    |
+| :it: Italian                            | `it`    |
-| :brazil: Portuguese (Brazil)          | `pt-br` |
+| :jp: Japanese                           | `ja`    |
-| :portugal: Portuguese (Portugal)      | `pt-pt` |
+| :brazil: Portuguese (Brazil)            | `pt-br` |
-| :romania: Romanian                    | `ro`    |
+| :portugal: Portuguese (Portugal)        | `pt-pt` |
-| :es: Spanish (Spain)                  | `es`    |
+| :romania: Romanian                      | `ro`    |
-| :tr: Turkish                          | `tr`    |
+| :es: Spanish (Spain)                    | `es`    |
+| :tr: Turkish                            | `tr`    |
 
 The default translations can be overridden by creating a custom file in `i18n/[code].yaml` that contains the translation strings. You can also use this method to add new languages. If you'd like to share a new translation with the community, please [open a pull request](https://github.com/jpanther/congo/pulls).
 

i18n/nl.yaml

@@ -0,0 +1,55 @@
+article:
+  anchor_label: "Anker"
+  date: "{{ .Date }}"
+  date_updated: "Bijgwerkt: {{ .Date }}"
+  draft: "Concept"
+  edit_title: "Bewerk inhoud"
+  reading_time:
+    one: "{{ .Count }} minuut"
+    other: "{{ .Count }} minuten"
+  reading_time_title: "Leestijd"
+  table_of_contents: "Inhoudsopgave"
+  word_count:
+    one: "{{ .Count }} woord"
+    other: "{{ .Count }} woorden"
+
+author:
+  byline_title: "Auteur"
+
+code:
+  copy: "Kopieer"
+  copied: "Gekopieerd"
+
+error:
+  404_title: "Pagina niet gevonden :confused:"
+  404_error: "Fout 404"
+  404_description: "Het lijkt er op dat de opgevraagde pagina niet bestaat."
+
+footer:
+  dark_appearance: "Omschakelen naar donker uiterlijk"
+  light_appearance: "Omschakelen naar licht uiterlijk"
+  powered_by: "Aangedreven door {{ .Hugo }} & {{ .Congo }}"
+
+list:
+  externalurl_title: "Link naar externe site"
+  no_articles: "Er zijn nog geen artikelen om hier weer te geven."
+
+nav:
+  scroll_to_top_title: "Scroll naar toven"
+  skip_to_main: "Spring naar inhoud"
+
+search:
+  open_button_title: "Zoeken (/)"
+  close_button_title: "Sluiten (Esc)"
+  input_placeholder: "Zoeken"
+
+sharing:
+  email: "Verstuur via email"
+  facebook: "Deel op Facebook"
+  linkedin: "Deel op LinkedIn"
+  pinterest: "Pin op Pinterest"
+  reddit: "Verzend naar Reddit"
+  twitter: "Tweet op Twitter"
+
+shortcode:
+  recent_articles: "Recent"

layouts/partials/footer.html

@@ -69,6 +69,6 @@
   </div>
   {{/* Extend footer - eg. for extra scripts, etc. */}}
   {{ if templates.Exists "partials/extend-footer.html" }}
-    {{ partialCached "extend-footer.html" . }}
+    {{ partial "extend-footer.html" . }}
   {{ end }}
 </footer>

layouts/partials/head.html

@@ -4,6 +4,7 @@
     <meta http-equiv="content-language" content="{{ . }}" />
   {{ end }}
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <meta name="theme-color" content="rgb(255,255,255)" />
   <meta http-equiv="X-UA-Compatible" content="ie=edge" />
   {{/* Title */}}
   {{ if .IsHome -}}
@@ -14,9 +15,7 @@
     <meta name="title" content="{{ .Title | emojify }} &middot; {{ .Site.Title | emojify }}" />
   {{- end }}
   {{/* Metadata */}}
-  {{ with .Site.Params.description -}}
+  <meta name="description" content="{{ with .Description }}{{ . }}{{ else }}{{ if .IsPage }}{{ .Summary }}{{ else }}{{ with .Site.Params.description }}{{ . }}{{ end }}{{ end }}{{ end }}" />
-    <meta name="description" content="{{ . }}" />
-  {{- end }}
   {{ with .Site.Params.keywords -}}
     <meta name="keywords" content="{{ . }}" />
   {{- end }}
@@ -110,6 +109,6 @@
   {{ partialCached "analytics.html" .Site }}
   {{/* Extend head - eg. for custom analytics scripts, etc. */}}
   {{ if templates.Exists "partials/extend-head.html" }}
-    {{ partialCached "extend-head.html" .Site }}
+    {{ partial "extend-head.html" .Site }}
   {{ end }}
 </head>

layouts/partials/vendor.html

@@ -8,7 +8,7 @@
 {{ end }}
 {{/* Chart */}}
 {{ if .Page.HasShortcode "chart" }}
-  {{ $chartLib := resources.Get "lib/chart/chart.min.js" }}
+  {{ $chartLib := resources.Get "lib/chart/chart.umd.js" }}
   {{ $chartConfig := resources.Get "js/chart.js" }}
   {{ $chartConfig := $chartConfig | resources.Minify }}
   {{ $chartJS := slice $chartLib $chartConfig | resources.Concat "js/chart.bundle.js" | resources.Fingerprint "sha512" }}
@@ -31,6 +31,6 @@
   <script defer src="{{ $katexRenderJS.RelPermalink }}" integrity="{{ $katexRenderJS.Data.Integrity }}" onload="renderMathInElement(document.body);"></script>
   {{ $katexFonts := resources.Match "lib/katex/fonts/*" }}
   {{ range $katexFonts }}
-    <!-- {{ .RelPermalink }} -->
+    {{ .Publish }}
   {{ end }}
 {{ end }}

package-lock.json

@@ -1,17 +1,17 @@
 {
   "name": "hugo-congo-theme",
-  "version": "2.4.0",
+  "version": "2.4.1",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "hugo-congo-theme",
-      "version": "2.4.0",
+      "version": "2.4.1",
       "hasInstallScript": true,
       "license": "MIT",
       "devDependencies": {
         "@tailwindcss/typography": "^0.5.8",
-        "chart.js": "^3.9.1",
+        "chart.js": "^4.0.1",
         "fuse.js": "^6.6.2",
         "katex": "^0.16.3",
         "mermaid": "^9.2.2",
@@ -180,10 +180,13 @@
       }
     },
     "node_modules/chart.js": {
-      "version": "3.9.1",
+      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-3.9.1.tgz",
+      "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.0.1.tgz",
-      "integrity": "sha512-Ro2JbLmvg83gXF5F4sniaQ+lTbSv18E+TIf2cOeiH1Iqd2PGFOtem+DUufMZsCJwFE7ywPOpfXFBwRTGq7dh6w==",
+      "integrity": "sha512-5/8/9eBivwBZK81mKvmIwTb2Pmw4D/5h1RK9fBWZLLZ8mCJ+kfYNmV9rMrGoa5Hgy2/wVDBMLSUDudul2/9ihA==",
-      "dev": true
+      "dev": true,
+      "engines": {
+        "pnpm": "^7.0.0"
+      }
     },
     "node_modules/chokidar": {
       "version": "3.5.3",
@@ -2087,9 +2090,9 @@
       "dev": true
     },
     "chart.js": {
-      "version": "3.9.1",
+      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-3.9.1.tgz",
+      "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.0.1.tgz",
-      "integrity": "sha512-Ro2JbLmvg83gXF5F4sniaQ+lTbSv18E+TIf2cOeiH1Iqd2PGFOtem+DUufMZsCJwFE7ywPOpfXFBwRTGq7dh6w==",
+      "integrity": "sha512-5/8/9eBivwBZK81mKvmIwTb2Pmw4D/5h1RK9fBWZLLZ8mCJ+kfYNmV9rMrGoa5Hgy2/wVDBMLSUDudul2/9ihA==",
       "dev": true
     },
     "chokidar": {

package.json

@@ -1,11 +1,11 @@
 {
   "name": "hugo-congo-theme",
-  "version": "2.4.1",
+  "version": "2.4.2",
   "description": "Congo theme for Hugo",
   "scripts": {
-    "preinstall": "rimraf assets/vendor",
+    "preinstall": "rimraf assets/lib",
     "postinstall": "vendor-copy",
-    "assets": "rimraf assets/vendor && vendor-copy",
+    "assets": "rimraf assets/lib && vendor-copy",
     "dev": "NODE_ENV=development ./node_modules/tailwindcss/lib/cli.js -i ./assets/css/main.css -o ./assets/css/compiled/main.css --jit -w",
     "build": "NODE_ENV=production ./node_modules/tailwindcss/lib/cli.js -i ./assets/css/main.css -o ./assets/css/compiled/main.css --jit",
     "example": "hugo server --source exampleSite --themesDir ../.. --buildDrafts -b http://localhost/congo/ -p 8008",
@@ -30,7 +30,7 @@
   "homepage": "https://github.com/jpanther/congo#readme",
   "devDependencies": {
     "@tailwindcss/typography": "^0.5.8",
-    "chart.js": "^3.9.1",
+    "chart.js": "^4.0.1",
     "fuse.js": "^6.6.2",
     "katex": "^0.16.3",
     "mermaid": "^9.2.2",
@@ -48,8 +48,8 @@
       "to": "assets/lib/mermaid/mermaid.min.js"
     },
     {
-      "from": "node_modules/chart.js/dist/chart.min.js",
+      "from": "node_modules/chart.js/dist/chart.umd.js",
-      "to": "assets/lib/chart/chart.min.js"
+      "to": "assets/lib/chart/chart.umd.js"
     },
     {
       "from": "node_modules/katex/dist/katex.min.js",