Merge c8e20a219f into 4acfb7b76a

Fixes: #794

CHANGELOG.md

@@ -6,6 +6,21 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ## [Unreleased]
 
+## [2.8.1] - 2024-03-09
+
+### Changed
+
+- Upgrade to ChartJS v4.4.2 ([#817](https://github.com/jpanther/congo/pull/817))
+- Upgrade to Mermaid v10.9.0 ([#825](https://github.com/jpanther/congo/pull/825))
+
+### Fixed
+
+- Table of Contents missing left border detail ([#794](https://github.com/jpanther/congo/issues/794))
+- `x-twitter` option missing when using sharing links ([#809](https://github.com/jpanther/congo/issues/809))
+- Chinese default config contains incorrect `author` block name ([#807](https://github.com/jpanther/congo/pull/807))
+- Links in articles are prefixed with a blank space ([#813](https://github.com/jpanther/congo/pull/813))
+- HTML tables would not fill the container width on desktop ([#826](https://github.com/jpanther/congo/issues/826))
+
 ## [2.8.0] - 2024-01-22
 
 ### Added
@@ -841,7 +856,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.8.0...HEAD
+[Unreleased]: https://github.com/jpanther/congo/compare/v2.8.1...HEAD
+[2.8.1]: https://github.com/jpanther/congo/compare/v2.8.0...v2.8.1
 [2.8.0]: https://github.com/jpanther/congo/compare/v2.7.6...v2.8.0
 [2.7.6]: https://github.com/jpanther/congo/compare/v2.7.5...v2.7.6
 [2.7.5]: https://github.com/jpanther/congo/compare/v2.7.4...v2.7.5

assets/css/compiled/main.css

@@ -1,4 +1,4 @@
-/*! Congo v2.8.0 | MIT License | https://github.com/jpanther/congo */
+/*! Congo v2.8.1 | MIT License | https://github.com/jpanther/congo */
 
 /*! tailwindcss v3.4.1 | MIT License | https://tailwindcss.com */
 
@@ -1254,13 +1254,18 @@ table {
   overflow: auto;
 }
 
+@media (min-width: 768px) {
+  table {
+    display: table;
+  }
+}
+
 /* Fix long inline code sections breaking out of article on mobile */
 
 code {
   word-wrap: break-word;
   /* All browsers since IE 5.5+ */
   overflow-wrap: break-word;
-  /* Renamed property in CSS3 draft spec */
 }
 
 /* -- Chroma Highlight -- */

assets/css/main.css

@@ -1,4 +1,4 @@
-/*! Congo v2.8.0 | MIT License | https://github.com/jpanther/congo */
+/*! Congo v2.8.1 | MIT License | https://github.com/jpanther/congo */
 
 @tailwind base;
 @tailwind components;
@@ -109,14 +109,13 @@ body:has(#menu-controller:checked) {
 
 /* Fix long tables breaking out of article on mobile */
 table {
-  display: block;
+  @apply block overflow-auto md:table;
-  overflow: auto;
 }
 
 /* Fix long inline code sections breaking out of article on mobile */
 code {
   word-wrap: break-word; /* All browsers since IE 5.5+ */
-  overflow-wrap: break-word; /* Renamed property in CSS3 draft spec */
+  @apply break-words;
 }
 
 /* -- Chroma Highlight -- */

config/_default/params.toml

@@ -51,7 +51,7 @@ fingerprintAlgorithm = "sha256"
   showTaxonomies = false
   showWordCount = false
   showComments = false
-  # sharingLinks = ["facebook", "twitter", "mastodon", "pinterest", "reddit", "linkedin", "email", "telegram", "line", "weibo"]
+  # sharingLinks = ["facebook", "x-twitter", "mastodon", "pinterest", "reddit", "linkedin", "email", "telegram", "line", "weibo"]
 
 [list]
   showBreadcrumbs = false

data/sharing.json

@@ -34,6 +34,11 @@
     "title": "sharing.twitter",
     "url": "https://twitter.com/intent/tweet/?url=%s&text=%s"
   },
+  "x-twitter": {
+    "icon": "x-twitter",
+    "title": "sharing.x-twitter",
+    "url": "https://x.com/intent/tweet/?url=%s&text=%s"
+  },
   "telegram": {
     "icon": "telegram",
     "title": "sharing.telegram",

exampleSite/config/_default/languages.zh-CN.toml

@@ -12,7 +12,7 @@ copyright = "© 2023 Congo contributors"
   mainSections = ["samples"]
   description = "一款基于Tailwindcss的强大且轻量的Hugo主题"
 
-[author]
+[params.author]
   name = "Congo"
   image = "img/author.jpg"
   headline = "非凡的主题！"

exampleSite/content/docs/configuration/index.md

@@ -162,7 +162,7 @@ Many of the article defaults here can be overridden on a per article basis by sp
 |`article.showTaxonomies`|`false`|Whether or not the taxonomies related to this article are displayed.|
 |`article.showWordCount`|`false`|Whether or not article word counts are displayed.|
 |`article.showComments`|`false`|Whether or not the [comments partial]({{< ref "partials#comments" >}}) is included after the article footer.|
-|`article.sharingLinks`|_Not set_|An array of sharing links to display at the end of each article. Valid options include `facebook`, `twitter`, `mastodon`, `pinterest`, `reddit`, `linkedin`, `email`, `telegram` and `line`. When not provided, or set to `false`, no links will be displayed.|
+|`article.sharingLinks`|_Not set_|An array of sharing links to display at the end of each article. Valid options include `facebook`, `x-twitter`, `mastodon`, `pinterest`, `reddit`, `linkedin`, `email`, `telegram` and `line`. When not provided, or set to `false`, no links will be displayed.|
 |`list.showBreadcrumbs`|`false`|Whether or not breadcrumbs are displayed in the header on list pages.|
 |`list.showTableOfContents`|`false`|Whether or not the table of contents is displayed on list pages.|
 |`list.showTaxonomies`|`false`|Whether or not the taxonomies related to this article are displayed on list pages.|

exampleSite/content/users/index.es.md

@@ -72,5 +72,6 @@ La lista a continuación es solo un puñado de sitios web creados con el tema Co
 | [aminelch.github.io](https://aminelch.github.io)                       | Personal Site and Blog          |
 | [robertboscacci.com](https://robertboscacci.com)                       | Personal Site and Blog          |
 | [gorbe.io](https://www.gorbe.io)                                       | Business Site and Blog          |
+| [techwolf12.nl](https://techwolf12.nl)                       | Personal Site and Tech Blog          |
 
 **¿Usuaria de congo?** Para agregar tu sitio a esta lista, [haz un pull request](https://github.com/jpanther/congo/blob/dev/exampleSite/content/users/index.md).

exampleSite/content/users/index.ja.md

@@ -72,5 +72,6 @@ Congoを使用して構築された実際のウェブサイト。
 | [aminelch.github.io](https://aminelch.github.io)                       | Personal Site and Blog          |
 | [robertboscacci.com](https://robertboscacci.com)                       | Personal Site and Blog          |
 | [gorbe.io](https://www.gorbe.io)                                       | Business Site and Blog          |
+| [techwolf12.nl](https://techwolf12.nl)                       | Personal Site and Tech Blog          |
 
 **Congoを使っていますか？** あなたのウェブサイトを加えるために[Pull Request](https://github.com/jpanther/congo/blob/dev/exampleSite/content/users/index.md)を投げてください。

exampleSite/content/users/index.md

@@ -72,5 +72,6 @@ The list below is just a handful of the websites that are built using the Congo
 | [aminelch.github.io](https://aminelch.github.io)                       | Personal Site and Blog          |
 | [robertboscacci.com](https://robertboscacci.com)                       | Personal Site and Blog          |
 | [gorbe.io](https://www.gorbe.io)                                       | Business Site and Blog          |
+| [techwolf12.nl](https://techwolf12.nl)                       | Personal Site and Tech Blog          |
 
 **Congo user?** To add your site to this list, [submit a pull request](https://github.com/jpanther/congo/blob/dev/exampleSite/content/users/index.md).

exampleSite/content/users/index.zh-cn.md

@@ -72,5 +72,6 @@ showEdit: false
 | [aminelch.github.io](https://aminelch.github.io)                       | Personal Site and Blog          |
 | [robertboscacci.com](https://robertboscacci.com)                       | Personal Site and Blog          |
 | [gorbe.io](https://www.gorbe.io)                                       | Business Site and Blog          |
+| [techwolf12.nl](https://techwolf12.nl)                       | Personal Site and Tech Blog          |
 
 **想成为Congo的用户？** 要将您的网站添加到此列表中，请提交[Pull Request](https://github.com/jpanther/congo/blob/dev/exampleSite/content/users/index.md)来添加。

i18n/ar.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "شارك على تيليجرام"
   line: "شارك على لاين"
   # weibo: "Share on Weibo"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "حديثًا"

i18n/bg.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "Споделете в Telegram"
   line: "Споделете в LINE"
   weibo: "Споделете в Weibo"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "Последни"

i18n/bn.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "টেলিগ্রামে শেয়ার করুন"
   line: "লাইনে শেয়ার করুন"
   # weibo: "Share on Weibo"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "সাম্প্রতিক"

i18n/cs.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "Sdílejte na Telegram"
   line: "Sdílejte na LINE"
   weibo: "Sdílejte na Weibo"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "Nedávné"

i18n/de.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "Auf Telegram teilen"
   line: "Auf LINE teilen"
   weibo: "Auf Weibo teilen"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "Neue Beiträge"

i18n/en.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "Share on Telegram"
   line: "Share on LINE"
   weibo: "Share on Weibo"
+  x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "Recent"

i18n/es.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "Compartir en Telegram"
   line: "Compartir en LINE"
   weibo: "Compartir en Weibo"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "Reciente"

i18n/fi.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "Jaa Telegramissa"
   line: "Jaa LINEssä"
   weibo: "Jaa Weibossä"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "Viimeaikaiset"

i18n/fr.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "Partager sur Telegram"
   line: "Partager sur LINE"
   weibo: "Partager sur Weibo"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "Articles récents"

i18n/he.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "שיתוף בטלגרם"
   line: "שיתוף בליין"
   # weibo: "Share on Weibo"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "חדשים"

i18n/hu.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "Megosztás a Telegramon"
   line: "Megosztás a LINE-on"
   weibo: "Megosztás a Weibo-on"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "Friss"

i18n/id.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "Bagikan ke Telegram"
   line: "Bagikan ke LINE"
   weibo: "Bagikan ke Weibo"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "Terbaru"

i18n/it.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "Condividi su Telegram"
   line: "Condividi su LINE"
   weibo: "Condividi su Weibo"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "Recenti"

i18n/ja.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "Telegramでシェアする"
   line: "LINEでシェアする"
   weibo: "Weiboでシェアする"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "最近の記事"

i18n/ko.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "Telegram에 공유하기"
   line: "LINE에 공유하기"
   weibo: "Weibo에 공유하기"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "최신 글"

i18n/nl.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "Deel op Telegram"
   line: "Deel op LINE"
   weibo: "Deel op Weibo"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "Recent"

i18n/pl.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "Udostępnij na Telegram"
   line: "Udostępnij na LINE"
   weibo: "Udostępnij na Weibo"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "Ostatnie"

i18n/pt-BR.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "Compartilhar pelo Telegram"
   line: "Compartilhar pelo LINE"
   weibo: "Compartilhar pelo weibo"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "Recente"

i18n/pt-PT.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "Partilhar pelo Telegram"
   line: "Partilhar pelo LINE"
   weibo: "Partilhar pelo Weibo"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "Recente"

i18n/ro.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "Trimite pe Telegram"
   line: "Trimite pe LINE"
   weibo: "Trimite pe Weibo"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "Cele mai noi"

i18n/ru.yaml

@@ -58,6 +58,7 @@ sharing:
   telegram: "Поделиться на Telegram"
   line: "Поделиться на LINE"
   weibo: "Поделиться на Weibo"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "Последние"

i18n/sk.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "Zdieľaj na Telegram"
   line: "Zdieľaj na LINE"
   weibo: "Zdieľaj na Weibo"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "Nedávne"

i18n/tr.yaml

@@ -53,6 +53,7 @@ sharing:
   telegram: "Telegram'da paylaş"
   line: "LINE'da paylaş"
   weibo: "Weibo'da paylaş"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "Güncel"

i18n/uk.yaml

@@ -58,6 +58,7 @@ sharing:
   telegram: "Поширити на Telegram"
   line: "Поширити на LINE"
   weibo: "Поширити на Weibo"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "Недавні дописи"

i18n/zh-CN.yaml

@@ -53,6 +53,7 @@ sharing:
   telegram: "分享到 Telegram"
   line: "分享到 LINE"
   weibo: "分享到 微博"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "最近的文章"

i18n/zh-TW.yaml

@@ -54,6 +54,7 @@ sharing:
   telegram: "分享到 Telegram"
   line: "分享到 LINE"
   weibo: "分享到 微博"
+  # x-twitter: "Post on X"
 
 shortcode:
   recent_articles: "最近的文章"

layouts/_default/_markup/render-link.html

@@ -1,9 +1,9 @@
 {{- $link := .Destination -}}
 {{- $isRemote := strings.HasPrefix $link "http" -}}
 {{- if not $isRemote }}
-  {{ $url := urls.Parse .Destination }}
+  {{- $url := urls.Parse .Destination -}}
   {{- if $url.Path }}
-    {{ $fragment := "" }}
+    {{- $fragment := "" }}
     {{- with $url.Fragment }}{{ $fragment = printf "#%s" . }}{{ end -}}
     {{- with .Page.GetPage $url.Path }}
       {{ $link = printf "%s%s" .RelPermalink $fragment }}
@@ -14,5 +14,4 @@
     {{ end -}}
   {{ end -}}
 {{ end -}}
-<!-- prettier-ignore -->
+<!-- prettier-ignore --><a href="{{ $link | safeURL }}"{{ with .Title }} title="{{ . }}"{{ end }}{{ if $isRemote }} target="_blank" rel="noreferrer"{{ end }}>{{- .Text | safeHTML -}}</a>
-<a href="{{ $link | safeURL }}"{{ with .Title }} title="{{ . }}"{{ end }}{{ if $isRemote }} target="_blank" rel="noreferrer"{{ end }}>{{- .Text | safeHTML -}}</a>

layouts/partials/toc.html

@@ -1,10 +1,10 @@
 <details open class="-ms-5 mt-0 overflow-hidden rounded-lg ps-5">
   <summary
-    class="-ms-5 block cursor-pointer bg-neutral-100 py-1 ps-5 text-lg font-semibold text-neutral-800 lg:hidden dark:bg-neutral-700 dark:text-neutral-100"
+    class="block cursor-pointer bg-neutral-100 py-1 ps-5 text-lg font-semibold text-neutral-800 dark:bg-neutral-700 dark:text-neutral-100 lg:hidden"
   >
     {{ i18n "article.table_of_contents" }}
   </summary>
-  <div class="-ms-5 border-s border-dotted border-neutral-300 py-2 ps-5 dark:border-neutral-600">
+  <div class="border-s border-dotted border-neutral-300 py-2 ps-5 dark:border-neutral-600">
     {{ .TableOfContents | emojify }}
   </div>
 </details>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "hugo-congo-theme",
-  "version": "2.8.0",
+  "version": "2.8.1",
   "description": "Congo theme for Hugo",
   "scripts": {
     "preinstall": "rimraf assets/lib",
@@ -9,7 +9,8 @@
     "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 --bind 0.0.0.0 -p 8008 --source exampleSite --themesDir ../.. --buildDrafts -b http://localhost/congo/ ",
-    "lighthouse": "lhci autorun"
+    "lighthouse": "lhci autorun",
+    "add-icon": "node scripts/index.js add-icon"
   },
   "repository": {
     "type": "git",
@@ -30,13 +31,14 @@
   "homepage": "https://github.com/jpanther/congo#readme",
   "devDependencies": {
     "@tailwindcss/typography": "^0.5.10",
-    "chart.js": "^4.4.1",
+    "chart.js": "^4.4.2",
     "fuse.js": "^7.0.0",
+    "jsdom": "^23.0.1",
     "katex": "^0.16.9",
-    "mermaid": "^10.7.0",
+    "mermaid": "^10.9.0",
     "prettier": "^3.2.5",
     "prettier-plugin-go-template": "^0.0.15",
-    "prettier-plugin-tailwindcss": "^0.5.11",
+    "prettier-plugin-tailwindcss": "^0.5.12",
     "quicklink": "^2.3.0",
     "rimraf": "^5.0.5",
     "tailwindcss": "^3.4.1",
@@ -76,5 +78,8 @@
       "from": "node_modules/quicklink/dist/quicklink.umd.js",
       "to": "assets/lib/quicklink/quicklink.umd.js"
     }
-  ]
+  ],
+  "dependencies": {
+    "@fortawesome/fontawesome-free": "^6.5.1"
+  }
 }

scripts/index.js

@@ -0,0 +1,11 @@
+#!/usr/bin/env node
+const { program } = require("commander");
+const { add_icon_to_congo } = require("./update_icon");
+
+// Adds an icon to the project.
+program
+  .command("add-icon <icon_name>")
+  .description("Add icon to the project")
+  .action(add_icon_to_congo);
+
+program.parse(process.argv);

scripts/update_icon.js

@@ -0,0 +1,90 @@
+const jsdom = require("jsdom");
+const fs = require("fs");
+
+const SVG_FILE_DIR = 'node_modules/@fortawesome/fontawesome-free/svgs/brands';
+const DOC_DIR = "./exampleSite/content/samples/icons";
+const DEFAULT_TABLE_DELIMITER = "| -------------------- | --------------------------------- |";
+
+/**
+ * Saves an icon to the congo project and update documentation.
+ * @param {string} icon_name Icon name from Font Awesome to download
+ * @returns null
+ */
+const add_icon_to_congo = async (icon_name) => {
+  try {
+    const file = await get_file(icon_name);
+    const final_svg = modify_svg_string(file);
+    const icon_download_path = create_icon_download_path(icon_name);
+    save_file(icon_download_path, final_svg);
+    add_documentation(icon_name);
+  } catch (e) {
+    console.log(e);
+    return;
+  }
+};
+
+const modify_svg_string = (svg_string) => {
+  try {
+    dom = new jsdom.JSDOM(svg_string);
+    svg = dom.window.document.documentElement.querySelector("svg");
+    svg.querySelector("path").setAttribute("fill", "currentColor");
+    return svg.outerHTML;
+  } catch (e) {
+    throw new Error("Invalid SVG file" + e);
+  }
+};
+
+const create_icon_download_path = (icon_name) => {
+  return `./assets/icons/${icon_name}.svg`;
+};
+
+const get_file = async (url) => {
+  return fs.readFileSync(SVG_FILE_DIR + `/${url}.svg`, "utf8");
+};
+
+const save_file = (file_path, file) => {
+  console.log("Saving file at " + file_path + "...");
+  fs.writeFile(file_path, file, function (err) {
+    if (err) throw err;
+    console.log("File saved!");
+  });
+};
+
+const add_documentation = async (icon_name) => {
+  files = get_md_docs();
+
+  for (const file of files) {
+    const file_path = `${DOC_DIR}/${file}`;
+    const file_contents = fs.readFileSync(file_path, "utf8");
+    const file_result = process_file(file_contents, icon_name);
+    // Save file_result to file_path
+    fs.writeFile(file_path, file_result, function (err) {
+      if (err) throw err;
+    });
+    console.log(`Updated ${file_path}`);
+  }
+};
+
+/**
+ * Process the file contents to include the icon name.
+ * @param {string} file_contents contents of the documentation files.
+ * @returns {string} processed file contents.
+ */
+const process_file = (file_contents, icon_name) => {
+  const [headers, table] = file_contents.split(DEFAULT_TABLE_DELIMITER);
+  const table_rows = table.split("\n").map((x) => x.trim()).filter((row) => row !== "");
+  table_rows.push(create_table_row(icon_name));
+  table_rows.sort();
+  const new_table = table_rows.join("\n");
+  return `${headers.trimEnd()}\n${DEFAULT_TABLE_DELIMITER}\n${new_table}\n`;
+};
+
+const create_table_row = (name) => {
+  return `| ${name}                | {{< icon ${name} >}}                |`
+}
+
+const get_md_docs = () => {
+  return fs.readdirSync(DOC_DIR).filter((file) => file.endsWith(".md"));
+};
+
+module.exports = { add_icon_to_congo };