release: 3.30.0

fix(giscus): rollback https://github.com/CaiJimmy/hugo-theme-stack/pull/1075

User can still customize the language used for Giscus using `.Site.Params.comments.giscus.lang` parameter.

assets/scss/partials/article.scss

@@ -131,6 +131,7 @@
 .article-tags {
     display: flex;
     gap: 10px;
+    flex-wrap: wrap;
 
     a {
         color: var(--accent-color-text);

assets/scss/partials/layout/article.scss

@@ -67,7 +67,6 @@
             }
 
             .article-tags {
-                flex-wrap: wrap;
                 text-transform: unset;
             }
 
@@ -222,6 +221,28 @@
         margin-inline-start: calc((var(--card-padding)) * -1);
         padding-inline-start: calc(var(--card-padding) - var(--heading-border-size));
         border-inline-start: var(--heading-border-size) solid var(--accent-color);
+        position: relative;
+
+        a.header-anchor {
+            transition: opacity 0.3s ease;
+            opacity: 0;
+            position: absolute;
+            left: 0;
+            width: var(--card-padding);
+            text-align: center;
+            color: var(--accent-color);
+
+            &:before {
+                content: "#";
+            }
+        }
+
+        &:hover,
+        &:focus {
+            a.header-anchor {
+                opacity: 1;
+            }
+        }
     }
 
     figure {

assets/ts/colorScheme.ts

@@ -8,6 +8,10 @@ class StackColorScheme {
     constructor(toggleEl: HTMLElement) {
         this.bindMatchMedia();
         this.currentScheme = this.getSavedScheme();
+        if (window.matchMedia('(prefers-color-scheme: dark)').matches === true)
+            this.systemPreferScheme = 'dark'
+        else
+            this.systemPreferScheme = 'light';
 
         this.dispatchEvent(document.documentElement.dataset.scheme as colorScheme);
 

assets/ts/search.tsx

@@ -53,7 +53,14 @@ class Search {
         this.resultTitle = resultTitle;
         this.resultTitleTemplate = resultTitleTemplate;
 
+        /// Check if there's already value in the search input
+        if (this.input.value.trim() !== '') {
+            this.doSearch(this.input.value.split(' '));
+        }
+        else {
             this.handleQueryString();
+        }
+
         this.bindQueryStringChange();
         this.bindSearchForm();
     }

config.yaml

@@ -28,6 +28,7 @@ params:
             src: img/avatar.png
 
     article:
+        headingAnchor: false
         math: false
         toc: true
         readingTime: true

exampleSite/hugo.yaml

@@ -1,7 +1,6 @@
-baseurl: https://example.com
+baseurl: https://example.com/
 languageCode: en-us
 theme: hugo-theme-stack
-paginate: 3
 title: Example Site
 copyright: Example Person
 
@@ -19,20 +18,23 @@ languages:
         title: Example Site
         weight: 1
         params:
-            description: Example description
+            sidebar:
+                subtitle: Example description
     zh-cn:
         languageName: 中文
         title: 演示站点
         weight: 2
         params:
-            description: 演示说明
+            sidebar:
+                subtitle: 演示说明
     ar:
         languageName: عربي
         languagedirection: rtl
         title: موقع تجريبي
         weight: 3
         params:
-            description: وصف تجريبي
+            sidebar:
+                subtitle: وصف تجريبي
 
 services:
     # Change it to your Disqus shortname before using
@@ -42,6 +44,9 @@ services:
     googleAnalytics:
         id:
 
+pagination:
+    pagerSize: 3
+
 permalinks:
     post: /p/:slug/
     page: /:slug/
@@ -156,6 +161,7 @@ params:
             repo:
             clientID:
             clientSecret:
+            proxy:
 
         cusdis:
             host:
@@ -234,6 +240,18 @@ related:
 
 markup:
     goldmark:
+        extensions:
+            passthrough:
+                enable: true
+                delimiters:
+                    block:
+                        - - \[
+                          - \]
+                        - - $$
+                          - $$
+                    inline:
+                        - - \(
+                          - \)
         renderer:
             ## Set to true if you have HTML content inside Markdown
             unsafe: true

i18n/ar.yaml

@@ -68,7 +68,7 @@ search:
 
 footer:
     builtWith:
-        other: "مبني بستخدام {{ .Generator }}"
+        other: "مبني باستخدام {{ .Generator }}"
         
     designedBy:
         other:  "قالب {{ .Theme }} مصمم من {{ .DesignedBy }}"

i18n/bg.yaml

@@ -0,0 +1,73 @@
+toggleMenu:
+    other: Покажи Меню
+
+darkMode:
+    other: Тъмен Режим
+
+list:
+    page:
+        one: "{{ .Count }} страница"
+        other: "{{ .Count }} страници"
+
+    section:
+        other: Секция
+
+    subsection:
+        one: Подсекция
+        other: Подсекции
+
+article:
+    back:
+        other: Назад
+
+    tableOfContents:
+        other: Съдържание
+
+    relatedContent:
+        other: Свързано Съдържание
+
+    lastUpdatedOn:
+        other: Последна промяна на
+
+    readingTime:
+        one: "{{ .Count }} minute read"
+        other: "{{ .Count }} minute read"
+
+notFound:
+    title:
+        other: Не е намерено
+
+    subtitle:
+        other: Страницата която търсите не е открита
+
+widget:
+    archives:
+        title:
+            other: Архиви
+
+        more:
+            other: Повече
+
+    tagCloud:
+        title:
+            other: Тагове
+    categoriesCloud:
+        title:
+            other: Категории
+
+search:
+    title:
+        other: Търсене
+
+    placeholder:
+        other: Напишете нещо...
+
+    resultTitle:
+        other: "#PAGES_COUNT страници (#TIME_SECONDS секунди)"
+
+footer:
+    builtWith:
+        other: Създадено с {{ .Generator }}
+
+    designedBy:
+        other: Тема {{ .Theme }} създадена от {{ .DesignedBy }}

i18n/fr.yaml

@@ -50,6 +50,9 @@ widget:
     tagCloud:
         title:
             other: Mots clés
+    categoriesCloud:
+        title:
+            other: Catégories
 
 search:
     title:

i18n/oc.yaml

@@ -0,0 +1,72 @@
+toggleMenu:
+    other: Alternar menú
+
+darkMode:
+    other: Mòde fosc
+
+list:
+    page:
+        one: "{{ .Count }} pagina"
+        other: "{{ .Count }} paginas"
+
+    section:
+        other: Seccion
+
+    subsection:
+        one: Josseccion
+        other: Josseccions
+
+article:
+    back:
+        other: Tornar
+
+    tableOfContents:
+        other: Taula de contengut
+
+    relatedContent:
+        other: Contenguts relacionats
+
+    lastUpdatedOn:
+        other: Darrièra actualizacion
+    readingTime:
+        one: "{{ .Count }} minuta de lectura"
+        other: "{{ .Count }} minutas de lectura"
+
+notFound:
+    title:
+        other: Non trobat
+
+    subtitle:
+        other: Aquesta pagina existís pas
+
+widget:
+    archives:
+        title:
+            other: Archiu
+
+        more:
+            other: Mai
+
+    tagCloud:
+        title:
+            other: Etiquetas
+    categoriesCloud:
+        title:
+            other: Categorias
+
+search:
+    title:
+        other: Cercar
+
+    placeholder:
+        other: Picatz quicòm...
+
+    resultTitle:
+        other: "#PAGES_COUNT paginas dins (#TIME_SECONDS segons)"
+
+footer:
+    builtWith:
+        other: Creat amb {{ .Generator }}
+
+    designedBy:
+        other: Tàma {{ .Theme }} concebut per {{ .DesignedBy }}

layouts/404.html

@@ -3,5 +3,43 @@
         <h1 class="article-title">{{ T "notFound.title" }}</h1>
         <h2 class="article-subtitle">{{ T "notFound.subtitle" }}</h2>
     </div>
+
+    {{- $query := first 1 (where .Site.Pages "Layout" "==" "search") -}}
+    {{- $searchPage := index $query 0 -}}
+
+    {{- with $searchPage -}}
+        <form action="{{ $searchPage.RelPermalink }}" class="search-form widget" {{ with .OutputFormats.Get "json" -}}data-json="{{ .Permalink }}" {{- end }}>
+            <p>
+                <label>{{ T "search.title" }}</label>
+                <input id="searchInput" name="keyword" required placeholder="{{ T `search.placeholder` }}" />
+            
+                <button title="{{ T `search.title` }}">
+                    {{ partial "helper/icon" "search" }}
+                </button>
+            </p>
+        </form>
+
+        <div class="search-result">
+            <h3 class="search-result--title section-title"></h3>
+            <div class="search-result--list article-list--compact"></div>
+        </div>
+        
+        <script>
+            window.searchResultTitleTemplate = "{{ T `search.resultTitle` }}"
+        </script>
+
+        {{- $opts := dict "minify" hugo.IsProduction "JSXFactory" "createElement" -}}
+        {{- $searchScript := resources.Get "ts/search.tsx" | js.Build $opts -}}
+        <script type="text/javascript" src="{{ $searchScript.RelPermalink }}" defer></script>
+
+        <script>
+            const wrongUrl = new URL(window.location.href);
+
+            /// Get the search keyword from the wrong URL by removing all slashes and dashes
+            const searchKeyword = wrongUrl.pathname.split(/[/|-]/).join(' ').trim();
+
+            document.getElementById('searchInput').setAttribute('value', searchKeyword);
+        </script>
+    {{- end -}}
     {{ partialCached "footer/footer" . }}
 {{ end }}

layouts/_default/_markup/render-heading.html

@@ -1,4 +1,6 @@
 <h{{ .Level }} id="{{ .Anchor }}">
-    <a href="#{{ .Anchor }}">#</a>
+    {{- if site.Params.Article.HeadingAnchor -}}
+        <a href="#{{ .Anchor }}" class="header-anchor"></a>
+    {{- end -}}
     {{ .Text | safeHTML }}
 </h{{ .Level }}>

layouts/_default/rss.xml

@@ -22,7 +22,7 @@
         <managingEditor>{{.}}{{ with $.Site.Params.Author.name }} ({{.}}){{end}}</managingEditor>{{end}}{{ with .Site.Params.Author.email }}
         <webMaster>{{.}}{{ with $.Site.Params.Author.name }} ({{.}}){{end}}</webMaster>{{end}}{{ with .Site.Copyright }}
         <copyright>{{.}}</copyright>{{end}}{{ if not .Date.IsZero }}
-        <lastBuildDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</lastBuildDate>{{ end }}
+        <lastBuildDate>{{ (index $pages.ByLastmod.Reverse 0).Lastmod.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</lastBuildDate>{{ end }}
         {{- with .OutputFormats.Get "RSS" -}}
         {{ printf "<atom:link href=%q rel=\"self\" type=%q />" .Permalink .MediaType | safeHTML }}
         {{- end -}}

layouts/partials/article/components/details.html

@@ -32,7 +32,7 @@
             <div>
                 {{ partial "helper/icon" "date" }}
                 <time class="article-time--published">
-                    {{- .Date.Format (or .Site.Params.dateFormat.published "Jan 02, 2006") -}}
+                    {{- .Date | time.Format (or .Site.Params.dateFormat.published "Jan 02, 2006") -}}
                 </time>
             </div>
         {{ end }}

layouts/partials/article/components/footer.html

@@ -12,7 +12,7 @@
     <section class="article-lastmod">
         {{ partial "helper/icon" "clock" }}
         <span>
-            {{ T "article.lastUpdatedOn" }} {{ .Lastmod.Format ( or .Site.Params.dateFormat.lastUpdated "Jan 02, 2006 15:04 MST" ) }}
+            {{ T "article.lastUpdatedOn" }} {{ .Lastmod | time.Format ( or .Site.Params.dateFormat.lastUpdated "Jan 02, 2006 15:04 MST" ) }}
         </span>
     </section>
     {{- end -}}

layouts/partials/article/components/math.html

@@ -1,7 +1,8 @@
 {{- partial "helper/external" (dict "Context" . "Namespace" "KaTeX") -}}
 <script>
     window.addEventListener("DOMContentLoaded", () => {
-        renderMathInElement(document.body, {
+	const mainArticleElement = document.querySelector(".main-article");
+        renderMathInElement(mainArticleElement, {
             delimiters: [
                 { left: "$$", right: "$$", display: true },
                 { left: "$", right: "$", display: false },

layouts/partials/comments/provider/disqusjs.html

@@ -2,7 +2,7 @@
 {{- $disqusjs := .Site.Params.Comments.disqusjs -}}
 {{- if and (not $pc.Disable) (and $disqusjs.Shortname $disqusjs.ApiKey) -}}
 
-{{- $style := resources.Get "scss/partials/comments/disqusjs.scss" | resources.ToCSS | minify -}}
+{{- $style := resources.Get "scss/partials/comments/disqusjs.scss" | toCSS | minify -}}
 <link rel="stylesheet" href="{{ $style.RelPermalink }}">
 
 <div class="disqus-container">

layouts/partials/comments/provider/giscus.html

@@ -12,6 +12,7 @@
     data-input-position="{{- default `top` .inputPosition -}}"
     data-theme="{{- default `light` .lightTheme -}}"
     data-lang="{{- default `en` .lang -}}"
+    data-loading="{{- .loading -}}"
     crossorigin="anonymous"
     async
 ></script>

layouts/partials/comments/provider/gitalk.html

@@ -15,6 +15,7 @@
         admin: ["{{- .admin -}}"],
         distractionFreeMode: false, // Facebook-like distraction free mode
         id: md5(location.pathname), // Max Location.pathname Legth:75  https://github.com/gitalk/gitalk/issues/102
+        proxy: {{- .proxy -}},
     });
     (function () {
         if (

layouts/partials/comments/provider/twikoo.html

@@ -1,4 +1,4 @@
-<script src="//cdn.jsdelivr.net/npm/twikoo@1.6.21/dist/twikoo.all.min.js"></script>
+<script src="//cdn.jsdelivr.net/npm/twikoo@1.6.39/dist/twikoo.all.min.js"></script>
 <div id="tcomment"></div>
 <style>
     .twikoo {

layouts/partials/footer/components/script.html

@@ -1,12 +1,12 @@
 {{- partial "helper/external" (dict "Context" . "Namespace" "Vibrant") -}}
 
 {{- $opts := dict "minify" hugo.IsProduction -}}
-{{- $script := resources.Get "ts/main.ts" | js.Build $opts -}}
+{{- $script := resources.Get "ts/main.ts" | js.Build $opts | fingerprint -}}
 
 <script type="text/javascript" src="{{ $script.RelPermalink }}" defer></script>
 
 {{- with resources.Get "ts/custom.ts" -}}
     {{/* Place your custom script in HUGO_SITE_FOLDER/assets/ts/custom.ts */}}
-    {{- $customScript := . | js.Build $opts -}}
+    {{- $customScript := . | js.Build $opts | fingerprint -}}
     <script type="text/javascript" src="{{ $customScript.RelPermalink }}" defer></script>
 {{- end -}}

layouts/partials/footer/footer.html

@@ -1,4 +1,4 @@
-{{- $ThemeVersion := "3.25.0" -}}
+{{- $ThemeVersion := "3.30.0" -}}
 <footer class="site-footer">
     <section class="copyright">
         &copy; 

layouts/partials/head/style.html

@@ -1,3 +1,3 @@
 {{ $sass := resources.Get "scss/style.scss" }}
-{{ $style := $sass | resources.ToCSS | minify | resources.Fingerprint "sha256" }}
+{{ $style := $sass | toCSS | minify | resources.Fingerprint "sha256" }}
 <link rel="stylesheet" href="{{ $style.RelPermalink }}">