ci: setup actions/checkout@v3 to fetch complete Git history (#32)

Attempt to fix #31

.github/workflows/pages.yml

@@ -35,6 +35,8 @@ jobs:
     steps:
       - name: Checkout
         uses: actions/checkout@v3
+        with:
+          fetch-depth: 0    # Fetch all history for .GitInfo and .Lastmod
       - name: Setup Go
         uses: actions/setup-go@v4
         with:

assets/css/compiled/main.css

@@ -2601,6 +2601,11 @@ video {
   background-color: rgb(243 244 246 / var(--tw-bg-opacity));
 }
 
+.bg-neutral-50 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(250 250 250 / var(--tw-bg-opacity));
+}
+
 .bg-orange-50 {
   --tw-bg-opacity: 1;
   background-color: rgb(255 247 237 / var(--tw-bg-opacity));
@@ -2854,6 +2859,10 @@ video {
   font-size: 1rem;
 }
 
+.text-lg {
+  font-size: 1.125rem;
+}
+
 .text-sm {
   font-size: .875rem;
 }
@@ -3200,6 +3209,16 @@ body {
   bottom: 0.25rem;
 }
 
+.before\:mr-1::before {
+  content: var(--tw-content);
+  margin-right: 0.25rem;
+}
+
+.before\:inline-block::before {
+  content: var(--tw-content);
+  display: inline-block;
+}
+
 .before\:w-px::before {
   content: var(--tw-content);
   width: 1px;
@@ -3216,11 +3235,23 @@ body {
   opacity: 0.25;
 }
 
+.before\:transition-transform::before {
+  content: var(--tw-content);
+  transition-property: transform;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+
 .before\:content-\[\'\#\'\]::before {
   --tw-content: '#';
   content: var(--tw-content);
 }
 
+.before\:content-\[\'\'\]::before {
+  --tw-content: '';
+  content: var(--tw-content);
+}
+
 .before\:content-\[\\\"\\\"\]::before {
   --tw-content: \"\";
   content: var(--tw-content);
@@ -3230,6 +3261,10 @@ body {
   margin-top: 0px;
 }
 
+.last-of-type\:mb-0:last-of-type {
+  margin-bottom: 0px;
+}
+
 .hover\:border-gray-200:hover {
   --tw-border-opacity: 1;
   border-color: rgb(229 231 235 / var(--tw-border-opacity));
@@ -3354,6 +3389,12 @@ body {
   --tw-shadow: var(--tw-shadow-colored);
 }
 
+.group[open] .group-open\:before\:rotate-90::before {
+  content: var(--tw-content);
+  --tw-rotate: 90deg;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
 .group\/code:hover .group-hover\/code\:opacity-100 {
   opacity: 1;
 }
@@ -3548,6 +3589,12 @@ body {
   right: 0px;
 }
 
+:is([dir="rtl"] .rtl\:before\:rotate-180)::before {
+  content: var(--tw-content);
+  --tw-rotate: 180deg;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
 @media (prefers-contrast: more) {
   .contrast-more\:border {
     border-width: 1px;
@@ -3821,6 +3868,12 @@ body {
   background-color: rgb(38 38 38 / var(--tw-bg-opacity));
 }
 
+:is(html[class~="dark"] .dark\:before\:invert)::before {
+  content: var(--tw-content);
+  --tw-invert: invert(100%);
+  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
+}
+
 :is(html[class~="dark"] .dark\:hover\:border-gray-600:hover) {
   --tw-border-opacity: 1;
   border-color: rgb(75 85 99 / var(--tw-border-opacity));
@@ -3850,6 +3903,11 @@ body {
   background-color: rgb(64 64 64 / var(--tw-bg-opacity));
 }
 
+:is(html[class~="dark"] .dark\:hover\:bg-neutral-800:hover) {
+  --tw-bg-opacity: 1;
+  background-color: rgb(38 38 38 / var(--tw-bg-opacity));
+}
+
 :is(html[class~="dark"] .dark\:hover\:bg-neutral-900:hover) {
   --tw-bg-opacity: 1;
   background-color: rgb(23 23 23 / var(--tw-bg-opacity));
@@ -4090,9 +4148,6 @@ body {
   .lg\:grid-cols-3 {
     grid-template-columns: repeat(3, minmax(0, 1fr));
   }
-  .lg\:leading-\[1\.1\] {
-    line-height: 1.1;
-  }
 }
 
 @media (min-width: 1280px) {

exampleSite/content/docs/getting-started.md

@@ -73,6 +73,21 @@ Voila! You can see your new site at `http://localhost:1313/`.
 {{% /steps %}}
 
 
+## Update Theme
+
+{{% details title="How to update theme?" %}}
+
+To update the theme to the [latest released version](https://github.com/imfing/hextra/releases), run the following command:
+
+```shell
+$ hugo mod get -u
+```
+
+See [Hugo Modules](https://gohugo.io/hugo-modules/use-modules/#update-all-modules) for more details.
+
+{{% /details %}}
+
+
 ## Next
 
 Explore the following sections to start adding more contents:

exampleSite/content/docs/guide/configuration.md

@@ -124,3 +124,16 @@ params:
   editURL: "https://example.com/edit/this/page"
 ---
 ```
+
+## Footer
+
+### Copyright
+
+To modify the copyright text displayed in your website's footer, you'll need to create a file named `i18n/en.yaml`.
+In this file, specify your new copyright text as shown below:
+
+```yaml {filename="i18n/en.yaml"}
+copyright: "© 2023 YOUR TEXT HERE"
+```
+
+For your reference, an example [`i18n/en.yaml`](https://github.com/imfing/hextra/blob/main/i18n/en.yaml) file can be found in the GitHub repository. Additionally, you could use Markdown format in the copyright text.

exampleSite/content/docs/guide/shortcodes/_index.md

@@ -13,6 +13,7 @@ Hextra provides a collection of beautiful shortcodes to enhance your content.
 {{< cards >}}
   {{< card link="callout" title="Callout" icon="warning" >}}
   {{< card link="cards" title="Cards" icon="card" >}}
+  {{< card link="details" title="Details" icon="chevron-right" >}}
   {{< card link="filetree" title="FileTree" icon="folder-tree" >}}
   {{< card link="icon" title="Icon" icon="badge-check" >}}
   {{< card link="steps" title="Steps" icon="one" >}}

exampleSite/content/docs/guide/shortcodes/details.md

@@ -0,0 +1,43 @@
+---
+title: Details
+---
+
+A built-in component to display a collapsible content.
+
+<!--more-->
+
+## Example
+
+{{% details title="Details" %}}
+
+This is the content of the details.
+
+Markdown is **supported**.
+
+{{% /details %}}
+
+{{% details title="Click me to reveal" closed="true" %}}
+
+This will be hidden by default.
+
+{{% /details %}}
+
+## Usage
+
+````
+{{%/* details title="Details" */%}}
+
+This is the content of the details.
+
+Markdown is **supported**.
+
+{{%/* /details */%}}
+````
+
+````
+{{%/* details title="Click me to reveal" closed="true" */%}}
+
+This will be hidden by default.
+
+{{%/* /details */%}}
+````

exampleSite/hugo_stats.json

@@ -11,6 +11,7 @@
       "cite",
       "code",
       "del",
+      "details",
       "div",
       "em",
       "figcaption",
@@ -44,6 +45,7 @@
       "strong",
       "style",
       "sub",
+      "summary",
       "sup",
       "svg",
       "table",
@@ -80,10 +82,14 @@
       "before:bg-gray-200",
       "before:content-[\"\"]",
       "before:content-['#']",
+      "before:content-['']",
+      "before:inline-block",
       "before:inset-0",
       "before:inset-y-1",
+      "before:mr-1",
       "before:opacity-25",
       "before:pointer-events-none",
+      "before:transition-transform",
       "before:w-px",
       "bg-black/[.05]",
       "bg-blue-100",
@@ -91,6 +97,7 @@
       "bg-gradient-to-b",
       "bg-gradient-to-r",
       "bg-gray-100",
+      "bg-neutral-50",
       "bg-orange-50",
       "bg-primary-100",
       "bg-primary-400",
@@ -150,6 +157,7 @@
       "cursor-default",
       "cursor-pointer",
       "dark:before:bg-neutral-800",
+      "dark:before:invert",
       "dark:bg-blue-900/30",
       "dark:bg-dark",
       "dark:bg-dark/50",
@@ -178,6 +186,7 @@
       "dark:hidden",
       "dark:hover:bg-gray-100/5",
       "dark:hover:bg-neutral-700",
+      "dark:hover:bg-neutral-800",
       "dark:hover:bg-neutral-900",
       "dark:hover:bg-primary-100/5",
       "dark:hover:bg-primary-700",
@@ -250,6 +259,7 @@
       "group-data-[theme=dark]:hidden",
       "group-data-[theme=light]:hidden",
       "group-hover/code:opacity-100",
+      "group-open:before:rotate-90",
       "group/code",
       "group/copybtn",
       "grow",
@@ -305,6 +315,7 @@
       "justify-start",
       "language-options",
       "language-switcher",
+      "last-of-type:mb-0",
       "leading-5",
       "leading-6",
       "leading-7",
@@ -312,7 +323,6 @@
       "left-[24px]",
       "left-[36px]",
       "lg:grid-cols-3",
-      "lg:leading-[1.1]",
       "line-clamp-3",
       "list-none",
       "lntable",
@@ -413,6 +423,7 @@
       "overflow-y-auto",
       "overscroll-contain",
       "p-0.5",
+      "p-1",
       "p-1.5",
       "p-2",
       "p-4",
@@ -462,6 +473,7 @@
       "rtl:-ml-4",
       "rtl:-rotate-180",
       "rtl:before:right-0",
+      "rtl:before:rotate-180",
       "rtl:left-1.5",
       "rtl:left-3",
       "rtl:md:right-auto",
@@ -524,6 +536,7 @@
       "text-gray-800",
       "text-gray-900",
       "text-left",
+      "text-lg",
       "text-orange-800",
       "text-primary-800",
       "text-red-900",

layouts/_default/baseof.html

@@ -4,7 +4,7 @@
   <body dir="ltr">
     {{- partial "navbar.html" . -}}
     {{- block "main" . }}{{ end -}}
-    {{- if not .Site.Params.footer.disabled }}{{ partial "footer.html" . }}{{ end }}
+    {{- if (.Site.Params.footer.enable | default true) }}{{ partial "footer.html" . }}{{ end }}
   </body>
   {{ partial "scripts.html" . }}
 </html>

layouts/hextra-home.html

@@ -14,7 +14,7 @@
           {{- partial "utils/icon" (dict "name" "arrow-circle-right" "attributes" "height=14") -}}
         </a>
         <h1
-          class="text-4xl font-bold leading-tight tracking-tighter md:text-5xl lg:leading-[1.1] mt-6 bg-clip-text text-transparent bg-gradient-to-r from-gray-900 to-gray-600 dark:from-gray-100 dark:to-gray-400"
+          class="text-4xl font-bold leading-tight tracking-tighter md:text-5xl mt-6 bg-clip-text text-transparent bg-gradient-to-r from-gray-900 to-gray-600 dark:from-gray-100 dark:to-gray-400"
         >
           Build modern websites&nbsp;<br class="sm:block hidden" />
           with Markdown and Hugo

layouts/index.html

@@ -1,5 +1,5 @@
 {{ define "main" }}
-  <div class="mx-auto flex max-w-screen-xl">
+  <div class="mx-auto flex max-w-[90rem]">
     {{ partial "sidebar.html" (dict "context" . "disableSidebar" true "displayPlaceholder" true) }}
     {{ partial "toc.html" . }}
     <article class="w-full break-words flex min-h-[calc(100vh-var(--navbar-height))] min-w-0 justify-center pb-8 pr-[calc(env(safe-area-inset-right)-1.5rem)]">

layouts/partials/footer.html

@@ -16,7 +16,7 @@
   >
     <div class="flex w-full flex-col items-center sm:items-start">
       {{- if (.Site.Params.footer.displayPoweredBy | default true) }}<div class="font-semibold">{{ template "theme-credit" . }}</div>{{ end }}
-      {{- if .Site.Params.footer.displayCopyright }}<p class="mt-6 text-xs">{{ $copyright }}</p>{{ end }}
+      {{- if .Site.Params.footer.displayCopyright }}<p class="mt-6 text-xs">{{ $copyright | markdownify }}</p>{{ end }}
     </div>
   </div>
 </footer>

layouts/shortcodes/details.html

@@ -1,8 +1,8 @@
 {{- $title := .Get "title" | default "" -}}
 {{- $closed := eq (.Get "closed") "true" | default false -}}
 
-<details class="last-of-type:mb-0 rounded-lg bg-neutral-50 dark:bg-neutral-800 p-2 mt-4" data-expanded="true" {{ if not $closed }}open{{ end }}>
-  <summary class="flex items-center cursor-pointer select-none list-none p-1 transition-colors hover:bg-gray-100 dark:hover:bg-neutral-800 before:mr-1 before:inline-block before:transition-transform before:content-[''] dark:before:invert rtl:before:rotate-180 [[data-expanded]>&]:before:rotate-90">
+<details class="last-of-type:mb-0 rounded-lg bg-neutral-50 dark:bg-neutral-800 p-2 mt-4 group" {{ if not $closed }}open{{ end }}>
+  <summary class="flex items-center cursor-pointer select-none list-none p-1 rounded transition-colors hover:bg-gray-100 dark:hover:bg-neutral-800 before:mr-1 before:inline-block before:transition-transform before:content-[''] dark:before:invert rtl:before:rotate-180 group-open:before:rotate-90">
     <strong class="text-lg">{{ $title | markdownify }}</strong>
   </summary>
   <div class="p-2 overflow-hidden">