Genius/hextra
1
0
Fork 0
forked from drowl87/hextra_mirror
Code Pull Requests Activity

Merge branch 'main' of https://code.mygenius.co/Genius/hextra

Browse Source
This commit is contained in:
drowl87
2025-05-01 09:20:37 -04:00
parent 22d6311d04 c31f19254b
commit ae443cd75d
268 changed files with 7030 additions and 8539 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
layouts/404.html
View File

@ -1,27 +1,39 @@
<div style='font-family:system-ui,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji"; height:100vh; text-align:center; display:flex; flex-direction:column; align-items:center; justify-content:center'>
<div>
<style>
body {
color: #000;
background: #fff;
margin: 0;
}
.next-error-h1 {
border-right: 1px solid rgba(0, 0, 0, 0.3);
}
@media (prefers-color-scheme: dark) {
body {
color: #fff;
background: #000;
}
.next-error-h1 {
border-right: 1px solid rgba(255, 255, 255, 0.3);
}
}
</style>
<h1 class="next-error-h1" style='display: inline-block; margin: 0 20px 0 0; padding-right: 23px; font-size: 24px; font-weight: 500; vertical-align: top; line-height: 49px; font-feature-settings: "rlig" 1,"calt" 1,"ss01" 1,"ss06" 1 !important;'>404</h1>
<div style="display: inline-block; text-align: left">
<h2 style="font-size: 14px; font-weight: 400; line-height: 49px; margin: 0">This page could not be found.</h2>
<!DOCTYPE html>
<html lang="en">
<body
style='font-family:system-ui,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji"; height:100vh; text-align:center; display:flex; flex-direction:column; align-items:center; justify-content:center'>
<div>
<style>
body {
color: #000;
background: #fff;
margin: 0;
}
.next-error-h1 {
border-right: 1px solid rgba(0, 0, 0, 0.3);
}
@media (prefers-color-scheme: dark) {
body {
color: #fff;
background: #000;
}
.next-error-h1 {
border-right: 1px solid rgba(255, 255, 255, 0.3);
}
}
</style>
<h1 class="next-error-h1"
style='display: inline-block; margin: 0 20px 0 0; padding-right: 23px; font-size: 24px; font-weight: 500; vertical-align: top; line-height: 49px; font-feature-settings: "rlig" 1,"calt" 1,"ss01" 1,"ss06" 1 !important;'>
404</h1>
<div style="display: inline-block; text-align: left">
<h2 style="font-size: 14px; font-weight: 400; line-height: 49px; margin: 0">This page could not be found.
</h2>
</div>
</div>
</div>
</div>
</body>
</html>

9
layouts/_default/_markup/render-blockquote-alert.html Normal file
View File

@ -0,0 +1,9 @@
{{- if not (in (slice "note" "tip" "important" "warning" "caution") .AlertType) -}}
{{- warnf "Alert type %s is not supported" .AlertType -}}
{{- end -}}
{{- $content := .Text -}}
{{- $alertType := .AlertType -}}
{{- $alertTitle := .AlertTitle -}}
{{- partial "components/github-style-alert.html" (dict "content" $content "alertType" $alertType "alertTitle" $alertTitle) -}}

3
layouts/_default/_markup/render-blockquote-regular.html Normal file
View File

@ -0,0 +1,3 @@
<blockquote>
{{ .Text }}
</blockquote>

4
layouts/_default/_markup/render-codeblock-mermaid.html
View File

@ -1,4 +1,4 @@
<pre class="mermaid hx-mt-6">
{{- .Inner | safeHTML -}}
<pre class="mermaid hx:mt-6">
{{ .Inner | htmlEscape | safeHTML }}
</pre>
{{- .Page.Store.Set "hasMermaid" true -}}

11
layouts/_default/_markup/render-codeblock.html
View File

@ -1,12 +1,13 @@
{{- $class := .Attributes.class | default "" -}}
{{- $filename := .Attributes.filename | default "" -}}
{{- $base_url := .Attributes.base_url | default "" -}}
{{- $lang := .Attributes.lang | default .Type -}}
<div class="hextra-code-block hx-relative hx-mt-6 first:hx-mt-0 hx-group/code">
{{ partial "components/codeblock" (dict "filename" $filename "lang" $lang "content" .Inner "options" .Options) }}
<div class="hextra-code-block hx:relative hx:mt-6 hx:first:mt-0 hx:group/code">
{{- partial "components/codeblock" (dict "filename" $filename "lang" $lang "base_url" $base_url "content" .Inner "options" .Options) -}}
{{- if or (eq site.Params.highlight.copy.enable nil) (site.Params.highlight.copy.enable) }}
{{- partialCached "components/codeblock-copy-button" (dict "filename" $filename) $filename }}
{{ end }}
{{- if or (eq site.Params.highlight.copy.enable nil) (site.Params.highlight.copy.enable) -}}
{{- partialCached "components/codeblock-copy-button" (dict "filename" $filename) $filename -}}
{{- end -}}
</div>

2
layouts/_default/_markup/render-heading.html
View File

@ -1,7 +1,7 @@
<h{{ .Level }}>
{{- .Text | safeHTML -}}
{{- if gt .Level 1 -}}
<span class="hx-absolute -hx-mt-20" id="{{ .Anchor | safeURL }}"></span>
<span class="hx:absolute hx:-mt-20" id="{{ .Anchor | safeURL }}"></span>
<a href="#{{ .Anchor | safeURL }}" class="subheading-anchor" aria-label="Permalink for this section"></a>
{{- end -}}
</h{{ .Level }}>

26
layouts/_default/_markup/render-image.html
View File

@ -1,27 +1,43 @@
{{- $alt := .PlainText | safeHTML -}}
{{- $lazyLoading := .Page.Site.Params.enableImageLazyLoading | default true -}}
{{- $dest := .Destination -}}
{{- $url := urls.Parse $dest -}}
{{- $isLocal := not (urls.Parse $dest).Scheme -}}
{{- $isLocal := not $url.Scheme -}}
{{- $isPage := and (eq .Page.Kind "page") (not .Page.BundleType) -}}
{{- $startsWithSlash := hasPrefix $dest "/" -}}
{{- $startsWithRelative := hasPrefix $dest "../" -}}
{{- if and $dest $isLocal -}}
{{- if $startsWithSlash -}}
{{/* Images under static directory */}}
{{- $dest = (relURL (strings.TrimPrefix "/" $dest)) -}}
{{- with or (.PageInner.Resources.Get $url.Path) (resources.Get $url.Path) -}}
{{/* Images under assets directory */}}
{{- $query := cond $url.RawQuery (printf "?%s" $url.RawQuery) "" -}}
{{- $fragment := cond $url.Fragment (printf "?%s" $url.Fragment) "" -}}
{{- $dest = printf "%s%s%s" .RelPermalink $query $fragment -}}
{{- else -}}
{{/* Images under static directory */}}
{{- $dest = (relURL (strings.TrimPrefix "/" $dest)) -}}
{{- end -}}
{{- else if and $isPage (not $startsWithRelative) -}}
{{/* Images that are sibling to the individual page file */}}
{{ $dest = (printf "../%s" $dest) }}
{{- end -}}
{{- end -}}
{{- $attributes := "" -}}
{{- range $key, $value := .Attributes -}}
{{- if $value -}}
{{- $pair := printf "%s=%q" $key ($value | transform.HTMLEscape) -}}
{{- $attributes = printf "%s %s" $attributes $pair -}}
{{- end -}}
{{- end -}}
{{- with .Title -}}
<figure>
<img src="{{ $dest | safeURL }}" title="{{ . }}" alt="{{ $alt }}" {{ if $lazyLoading }}loading="lazy"{{ end }} />
<img src="{{ $dest | safeURL }}" title="{{ . }}" alt="{{ $alt }}" {{ $attributes | safeHTMLAttr }} {{ if $lazyLoading }}loading="lazy"{{ end }} />
<figcaption>{{ . }}</figcaption>
</figure>
{{- else -}}
<img src="{{ $dest | safeURL }}" alt="{{ $alt }}" {{ if $lazyLoading }}loading="lazy"{{ end }} />
<img src="{{ $dest | safeURL }}" alt="{{ $alt }}" {{ $attributes | safeHTMLAttr }} {{ if $lazyLoading }}loading="lazy"{{ end }} />
{{- end -}}

9
layouts/_default/_markup/render-passthrough.html Normal file
View File

@ -0,0 +1,9 @@
{{- $opts := dict "output" "htmlAndMathml" "displayMode" (eq .Type "block") }}
{{- with try (transform.ToMath .Inner $opts) }}
{{- with .Err }}
{{ errorf "Unable to render mathematical markup to HTML using the transform.ToMath function. The KaTeX display engine threw the following error: %s: see %s." . $.Position }}
{{- else }}
{{- .Value }}
{{- $.Page.Store.Set "hasMath" true }}
{{- end }}
{{- end -}}

12
layouts/_default/list.html
View File

@ -1,17 +1,17 @@
{{ define "main" }}
<div class='hx-mx-auto hx-flex {{ partial "utils/page-width" . }}'>
<div class='hx:mx-auto hx:flex {{ partial "utils/page-width" . }}'>
{{ partial "sidebar.html" (dict "context" .) }}
{{ partial "toc.html" . }}
<article class="hx-w-full hx-break-words hx-flex hx-min-h-[calc(100vh-var(--navbar-height))] hx-min-w-0 hx-justify-center hx-pb-8 hx-pr-[calc(env(safe-area-inset-right)-1.5rem)]">
<main class="hx-w-full hx-min-w-0 hx-max-w-6xl hx-px-6 hx-pt-4 md:hx-px-12">
<article class="hx:w-full hx:break-words hx:flex hx:min-h-[calc(100vh-var(--navbar-height))] hx:min-w-0 hx:justify-center hx:pb-8 hx:pr-[calc(env(safe-area-inset-right)-1.5rem)]">
<main class="hx:w-full hx:min-w-0 hx:max-w-6xl hx:px-6 hx:pt-4 hx:md:px-12">
<div class="content">
<h1>{{ .Title }}</h1>
{{ if .Title }}<h1>{{ .Title }}</h1>{{ end }}
{{ .Content }}
</div>
<div class="hx-mt-16"></div>
<div class="hx:mt-16"></div>
{{ partial "components/last-updated.html" . }}
{{ partial "components/comments.html" . }}
</main>
</article>
</div>
{{ end }}
{{ end }}

16
layouts/_default/single.html
View File

@ -1,18 +1,18 @@
{{ define "main" }}
<div class='hx-mx-auto hx-flex {{ partial "utils/page-width" . }}'>
<div class='hx:mx-auto hx:flex {{ partial "utils/page-width" . }}'>
{{ partial "sidebar.html" (dict "context" . "disableSidebar" true "displayPlaceholder" true) }}
{{ partial "toc.html" . }}
<article class="hx-w-full hx-break-words hx-flex hx-min-h-[calc(100vh-var(--navbar-height))] hx-min-w-0 hx-justify-center hx-pb-8 hx-pr-[calc(env(safe-area-inset-right)-1.5rem)]">
<main class="hx-w-full hx-min-w-0 hx-max-w-6xl hx-px-6 hx-pt-4 md:hx-px-12">
<br class="hx-mt-1.5 hx-text-sm" />
<h1 class="hx-text-center hx-mt-2 hx-text-4xl hx-font-bold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100">{{ .Title }}</h1>
<div class="hx-mb-16"></div>
<article class="hx:w-full hx:break-words hx:flex hx:min-h-[calc(100vh-var(--navbar-height))] hx:min-w-0 hx:justify-center hx:pb-8 hx:pr-[calc(env(safe-area-inset-right)-1.5rem)]">
<main class="hx:w-full hx:min-w-0 hx:max-w-6xl hx:px-6 hx:pt-4 hx:md:px-12">
<br class="hx:mt-1.5 hx:text-sm" />
{{ if .Title }}<h1 class="hx:text-center hx:mt-2 hx:text-4xl hx:font-bold hx:tracking-tight hx:text-slate-900 hx:dark:text-slate-100">{{ .Title }}</h1>{{ end }}
<div class="hx:mb-16"></div>
<div class="content">
{{ .Content }}
</div>
<div class="hx-mt-16"></div>
<div class="hx:mt-16"></div>
{{ partial "components/comments.html" . }}
</main>
</article>
</div>
{{ end }}
{{ end }}

30
layouts/_default/taxonomy.html Normal file
View File

@ -0,0 +1,30 @@
{{ define "main" }}
<div class='hx:mx-auto hx:flex {{ partial "utils/page-width" . }}'>
{{ partial "sidebar.html" (dict "context" . "disableSidebar" true "displayPlaceholder" true) }}
{{ partial "toc.html" (dict "Params" (dict "toc" false)) }}
<article class="hx:w-full hx:break-words hx:flex hx:min-h-[calc(100vh-var(--navbar-height))] hx:min-w-0 hx:justify-center hx:pb-8 hx:pr-[calc(env(safe-area-inset-right)-1.5rem)]">
<main class="hx:w-full hx:min-w-0 hx:max-w-6xl hx:px-6 hx:pt-4 hx:md:px-12">
<br class="hx:mt-1.5 hx:text-sm" />
{{ if .Title }}<h1 class="hx:text-center hx:mt-2 hx:text-4xl hx:font-bold hx:tracking-tight hx:text-slate-900 hx:dark:text-slate-100">{{ .Title }}</h1>{{ end }}
<div class="hx:mb-16"></div>
<div class="content">
{{ .Content }}
</div>
<div class="hx:grid hx:grid-cols-1 hx:md:grid-cols-2 hx:lg:grid-cols-3 hx:xl:grid-cols-4 hx:gap-4">
{{ range .Data.Terms }}
<div class="hx:w-full">
<a
href="{{ .Page.RelPermalink }}"
title="{{ .Page.LinkTitle }}"
class="hx:font-medium hx:hover:text-primary-600"
>
{{- .Page.LinkTitle -}}
<span class="hx:text-sm hx:text-gray-500">&nbsp;{{ .Count }}</span>
</a>
</div>
{{ end }}
</div>
</main>
</article>
</div>
{{ end }}

33
layouts/_default/term.html Normal file
View File

@ -0,0 +1,33 @@
{{ define "main" }}
<div class='hx:mx-auto hx:flex {{ partial "utils/page-width" . }}'>
{{ partial "sidebar.html" (dict "context" . "disableSidebar" true "displayPlaceholder" true) }}
{{ partial "toc.html" (dict "Params" (dict "toc" false)) }}
<article class="hx:w-full hx:break-words hx:flex hx:min-h-[calc(100vh-var(--navbar-height))] hx:min-w-0 hx:justify-center hx:pb-8 hx:pr-[calc(env(safe-area-inset-right)-1.5rem)]">
<main class="hx:w-full hx:min-w-0 hx:max-w-6xl hx:px-6 hx:pt-4 hx:md:px-12">
<br class="hx:mt-1.5 hx:text-sm" />
{{ if .Title }}<h1 class="hx:text-center hx:mt-2 hx:text-4xl hx:font-bold hx:tracking-tight hx:text-slate-900 hx:dark:text-slate-100">{{ .Title }}</h1>{{ end }}
<div class="hx:mb-16"></div>
<div class="content">
{{ .Content }}
</div>
<div>
{{- range .Pages -}}
<div>
<h3>
<a
style="color: inherit; text-decoration: none;"
class="hx:block hx:font-semibold hx:mt-8 hx:text-2xl"
href="{{ .RelPermalink }}"
title="{{ .LinkTitle }}"
>
{{ .Title }}
</a>
</h3>
<p class="hx:opacity-50 hx:text-sm hx:leading-7">{{ partial "utils/format-date" .Date }}</p>
</div>
{{- end -}}
</div>
</main>
</article>
</div>
{{ end }}

10
layouts/_default/wide.html
View File

@ -1,12 +1,12 @@
{{ define "main" }}
<div class="hx-mx-auto hx-flex hx-max-w-[90rem]">
<div class="hx:mx-auto hx:flex hx:max-w-[90rem]">
{{ partial "sidebar.html" (dict "context" . "disableSidebar" true "displayPlaceholder" false) }}
<article class="hx-w-full hx-break-words hx-min-h-[calc(100vh-var(--navbar-height))] hx-min-w-0 hx-pt-4 hx-pb-8 hx-pl-[max(env(safe-area-inset-left),1.5rem)] hx-pr-[max(env(safe-area-inset-left),1.5rem)]">
<br class="hx-mt-1.5 hx-text-sm" />
<h1 class="hx-text-center hx-mt-2 hx-text-4xl hx-font-bold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100">{{ .Title }}</h1>
<article class="hx:w-full hx:break-words hx:min-h-[calc(100vh-var(--navbar-height))] hx:min-w-0 hx:pt-4 hx:pb-8 hx:pl-[max(env(safe-area-inset-left),1.5rem)] hx:pr-[max(env(safe-area-inset-left),1.5rem)]">
<br class="hx:mt-1.5 hx:text-sm" />
{{ if .Title }}<h1 class="hx:text-center hx:mt-2 hx:text-4xl hx:font-bold hx:tracking-tight hx:text-slate-900 hx:dark:text-slate-100">{{ .Title }}</h1>{{ end }}
<div class="content">
{{ .Content }}
</div>
</article>
</div>
{{ end }}
{{ end }}

30
layouts/blog/list.html
View File

@ -1,34 +1,34 @@
{{ define "main" }}
{{- $readMore := (T "readMore") | default "Read more →" -}}
<div class="hx-mx-auto hx-flex {{ partial `utils/page-width` . }}">
<div class="hx:mx-auto hx:flex {{ partial `utils/page-width` . }}">
{{ partial "sidebar.html" (dict "context" . "disableSidebar" true "displayPlaceholder" true) }}
<article class="hx-w-full hx-break-words hx-flex hx-min-h-[calc(100vh-var(--navbar-height))] hx-min-w-0 hx-justify-center hx-pb-8 hx-pr-[calc(env(safe-area-inset-right)-1.5rem)]">
<main class="hx-w-full hx-min-w-0 hx-max-w-6xl hx-px-6 hx-pt-4 md:hx-px-12">
<br class="hx-mt-1.5 hx-text-sm" />
<h1 class="hx-text-center hx-mt-2 hx-text-4xl hx-font-bold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100">{{ .Title }}</h1>
<article class="hx:w-full hx:break-words hx:flex hx:min-h-[calc(100vh-var(--navbar-height))] hx:min-w-0 hx:justify-center hx:pb-8 hx:pr-[calc(env(safe-area-inset-right)-1.5rem)]">
<main class="hx:w-full hx:min-w-0 hx:max-w-6xl hx:px-6 hx:pt-4 hx:md:px-12">
<br class="hx:mt-1.5 hx:text-sm" />
{{ if .Title }}<h1 class="hx:text-center hx:mt-2 hx:text-4xl hx:font-bold hx:tracking-tight hx:text-slate-900 hx:dark:text-slate-100">{{ .Title }}</h1>{{ end }}
<div class="content">{{ .Content }}</div>
{{- $pages := partial "utils/sort-pages" (dict "page" . "by" site.Params.blog.list.sortBy "order" site.Params.blog.list.sortOrder) -}}
{{- range $pages }}
<div class="hx-mb-10">
<h3><a style="color: inherit; text-decoration: none;" class="hx-block hx-font-semibold hx-mt-8 hx-text-2xl " href="{{ .RelPermalink }}">{{ .Title }}</a></h3>
<div class="hx:mb-10">
<h3><a style="color: inherit; text-decoration: none;" class="hx:block hx:font-semibold hx:mt-8 hx:text-2xl " href="{{ .RelPermalink }}">{{ .Title }}</a></h3>
{{- if site.Params.blog.list.displayTags -}}
{{ with .Params.tags }}
<p class="hx-opacity-50 hx-text-sm hx-leading-7">
{{- range . }}<a class="hx-inline-block hx-mr-2">#{{ . }}</a>{{ end -}}
<p class="hx:opacity-50 hx:text-sm hx:leading-7">
{{- range . }}<a class="hx:inline-block hx:mr-2">#{{ . }}</a>{{ end -}}
</p>
{{ end -}}
{{- end -}}
<p class="hx-opacity-80 hx-mt-4 hx-leading-7">{{- partial "utils/page-description" . -}}</p>
<p class="hx-opacity-80 hx-mt-1 hx-leading-7">
<a class="hx-text-[color:hsl(var(--primary-hue),100%,50%)] hx-underline hx-underline-offset-2 hx-decoration-from-font" href="{{ .RelPermalink }}">
<p class="hx:opacity-80 hx:mt-4 hx:leading-7">{{- partial "utils/page-description" . -}}</p>
<p class="hx:opacity-80 hx:mt-1 hx:leading-7">
<a class="hx:text-[color:hsl(var(--primary-hue),100%,50%)] hx:underline hx:underline-offset-2 hx:decoration-from-font" href="{{ .RelPermalink }}">
{{- $readMore -}}
</a>
</p>
<p class="hx-opacity-50 hx-text-sm hx-mt-4 hx-leading-7">{{ partial "utils/format-date" .Date }}</p>
<p class="hx:opacity-50 hx:text-sm hx:mt-4 hx:leading-7">{{ partial "utils/format-date" .Date }}</p>
</div>
{{ end -}}
</main>
</article>
<div class="max-xl:hx-hidden hx-h-0 hx-w-64 hx-shrink-0"></div>
<div class="hx:max-xl:hidden hx:h-0 hx:w-64 hx:shrink-0"></div>
</div>
{{- end -}}
{{- end -}}

34
layouts/blog/single.html
View File

@ -1,22 +1,22 @@
{{ define "main" }}
<div class="hx-mx-auto hx-flex {{ partial `utils/page-width` . }}">
<div class="hx:mx-auto hx:flex {{ partial `utils/page-width` . }}">
{{ partial "sidebar.html" (dict "context" . "disableSidebar" true "displayPlaceholder" true) }}
{{ partial "toc.html" . }}
<article class="hx-w-full hx-break-words hx-flex hx-min-h-[calc(100vh-var(--navbar-height))] hx-min-w-0 hx-justify-center hx-pb-8 hx-pr-[calc(env(safe-area-inset-right)-1.5rem)]">
<main class="hx-w-full hx-min-w-0 hx-max-w-6xl hx-px-6 hx-pt-4 md:hx-px-12">
<article class="hx:w-full hx:break-words hx:flex hx:min-h-[calc(100vh-var(--navbar-height))] hx:min-w-0 hx:justify-center hx:pb-8 hx:pr-[calc(env(safe-area-inset-right)-1.5rem)]">
<main class="hx:w-full hx:min-w-0 hx:max-w-6xl hx:px-6 hx:pt-4 hx:md:px-12">
{{ partial "breadcrumb.html" . }}
<h1 class="hx-mt-2 hx-text-4xl hx-font-bold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100">{{ .Title }}</h1>
<div class="hx-mt-4 hx-mb-16 hx-text-gray-500 hx-text-sm hx-flex hx-items-center hx-flex-wrap hx-gap-y-2">
{{- with $date := .Date }}<span class="hx-mr-1">{{ partial "utils/format-date" $date }}</span>{{ end -}}
{{ if .Title }}<h1 class="hx:mt-2 hx:text-4xl hx:font-bold hx:tracking-tight hx:text-slate-900 hx:dark:text-slate-100">{{ .Title }}</h1>{{ end }}
<div class="hx:mt-4 hx:mb-16 hx:text-gray-500 hx:text-sm hx:flex hx:items-center hx:flex-wrap hx:gap-y-2">
{{- with $date := .Date }}<span class="hx:mr-1">{{ partial "utils/format-date" $date }}</span>{{ end -}}
{{- $lazyLoading := site.Params.enableImageLazyLoading | default true -}}
{{ if and .Date .Params.authors }}<span class="hx-mx-1">·</span>{{ end -}}
{{ if and .Date .Params.authors }}<span class="hx:mx-1">·</span>{{ end -}}
{{- with $.Params.authors -}}
{{- range $i, $author := . -}}
{{- if reflect.IsMap $author -}}
{{- if and $i (not $author.image) }}<span class="hx-mr-1">,</span>{{ end -}}
{{- if and $i (not $author.image) }}<span class="hx:mr-1">,</span>{{ end -}}
<a
{{ with $author.link }}href="{{ . }}" target="_blank"{{ end }}
class="hx-group hx-inline-flex hx-items-center hx-text-current hx-gap-x-1.5 hx-mx-1"
class="hx:group hx:inline-flex hx:items-center hx:text-current hx:gap-x-1.5 hx:mx-1"
{{ with $author.name }}title="{{ . }}"{{ end }}
>
{{- with $image := $author.image }}
@ -25,12 +25,12 @@
{{- if and $isLocal $startsWithSlash }}
{{- $image = (relURL (strings.TrimPrefix "/" $image)) -}}
{{ end -}}
<img src="{{ $image | safeURL }}" alt="{{ $author.name }}" class="hx-inline-block hx-h-4 hx-w-4 hx-rounded-full" {{ if $lazyLoading }}loading="lazy"{{ end }} />
<img src="{{ $image | safeURL }}" alt="{{ $author.name }}" class="hx:inline-block hx:h-4 hx:w-4 hx:rounded-full" {{ if $lazyLoading }}loading="lazy"{{ end }} />
{{ end -}}
<div class="group-hover:hx-underline">{{ $author.name }}</div>
<div class="hx:group-hover:underline">{{ $author.name }}</div>
</a>
{{- else -}}
{{- if $i }}<span class="hx-mr-1">,</span>{{ end -}}<span class="hx-mx-1">{{ $author }}</span>
{{- if $i }}<span class="hx:mr-1">,</span>{{ end -}}<span class="hx:mx-1">{{ $author }}</span>
{{- end -}}
{{- end -}}
{{- end -}}
@ -38,10 +38,12 @@
<div class="content">
{{ .Content }}
</div>
{{ partial "components/last-updated.html" . }}
{{ .Scratch.Set "reversePagination" true }}
{{ partial "components/pager.html" . }}
{{ partial "components/comments.html" . }}
{{- partial "components/last-updated.html" . -}}
{{- if (site.Params.blog.article.displayPagination | default true) -}}
{{- .Scratch.Set "reversePagination" true -}}
{{- partial "components/pager.html" . -}}
{{ end }}
{{- partial "components/comments.html" . -}}
</main>
</article>
</div>

10
layouts/docs/list.html
View File

@ -1,12 +1,12 @@
{{ define "main" }}
<div class='hx-mx-auto hx-flex {{ partial "utils/page-width" . }}'>
<div class='hx:mx-auto hx:flex {{ partial "utils/page-width" . }}'>
{{ partial "sidebar.html" (dict "context" .) }}
{{ partial "toc.html" . }}
<article class="hx-w-full hx-break-words hx-flex hx-min-h-[calc(100vh-var(--navbar-height))] hx-min-w-0 hx-justify-center hx-pb-8 hx-pr-[calc(env(safe-area-inset-right)-1.5rem)]">
<main class="hx-w-full hx-min-w-0 hx-max-w-6xl hx-px-6 hx-pt-4 md:hx-px-12">
<article class="hx:w-full hx:break-words hx:flex hx:min-h-[calc(100vh-var(--navbar-height))] hx:min-w-0 hx:justify-center hx:pb-8 hx:pr-[calc(env(safe-area-inset-right)-1.5rem)]">
<main class="hx:w-full hx:min-w-0 hx:max-w-6xl hx:px-6 hx:pt-4 hx:md:px-12">
{{ partial "breadcrumb.html" . }}
<div class="content">
<h1>{{ .Title }}</h1>
{{ if .Title }}<h1>{{ .Title }}</h1>{{ end }}
{{ .Content }}
</div>
{{ partial "components/last-updated.html" . }}
@ -15,4 +15,4 @@
</main>
</article>
</div>
{{ end }}
{{ end }}

10
layouts/docs/single.html
View File

@ -1,12 +1,12 @@
{{ define "main" }}
<div class='hx-mx-auto hx-flex {{ partial "utils/page-width" . }}'>
<div class='hx:mx-auto hx:flex {{ partial "utils/page-width" . }}'>
{{ partial "sidebar.html" (dict "context" .) }}
{{ partial "toc.html" . }}
<article class="hx-w-full hx-break-words hx-flex hx-min-h-[calc(100vh-var(--navbar-height))] hx-min-w-0 hx-justify-center hx-pb-8 hx-pr-[calc(env(safe-area-inset-right)-1.5rem)]">
<main class="hx-w-full hx-min-w-0 hx-max-w-6xl hx-px-6 hx-pt-4 md:hx-px-12">
<article class="hx:w-full hx:break-words hx:flex hx:min-h-[calc(100vh-var(--navbar-height))] hx:min-w-0 hx:justify-center hx:pb-8 hx:pr-[calc(env(safe-area-inset-right)-1.5rem)]">
<main class="hx:w-full hx:min-w-0 hx:max-w-6xl hx:px-6 hx:pt-4 hx:md:px-12">
{{ partial "breadcrumb.html" . }}
<div class="content">
<h1>{{ .Title }}</h1>
{{ if .Title }}<h1>{{ .Title }}</h1>{{ end }}
{{ .Content }}
</div>
{{ partial "components/last-updated.html" . }}
@ -15,4 +15,4 @@
</main>
</article>
</div>
{{ end }}
{{ end }}

6
layouts/hextra-home.html
View File

@ -1,8 +1,8 @@
{{ define "main" }}
<div class='hx-mx-auto hx-flex {{ partial "utils/page-width" . }}'>
<div class='hx:mx-auto hx:flex {{ partial "utils/page-width" . }}'>
{{ partial "sidebar.html" (dict "context" . "disableSidebar" true) }}
<div class="hx-w-full hx-break-words hx-min-h-[calc(100vh-var(--navbar-height))] hx-min-w-0 hx-pb-8 hx-pt-8 md:hx-pt-12 hx-pl-[max(env(safe-area-inset-left),1.5rem)] hx-pr-[max(env(safe-area-inset-left),1.5rem)]">
<div class="hx-flex hx-flex-col hx-items-start">
<div class="hx:w-full hx:break-words hx:min-h-[calc(100vh-var(--navbar-height))] hx:min-w-0 hx:pb-8 hx:pt-8 hx:md:pt-12 hx:pl-[max(env(safe-area-inset-left),1.5rem)] hx:pr-[max(env(safe-area-inset-left),1.5rem)]">
<div class="hx:flex hx:flex-col hx:items-start">
{{ .Content }}
</div>
</div>

10
layouts/index.html
View File

@ -1,14 +1,14 @@
{{ define "main" }}
<div class='hx-mx-auto hx-flex {{ partial "utils/page-width" . }}'>
<div class='hx:mx-auto hx:flex {{ partial "utils/page-width" . }}'>
{{ partial "sidebar.html" (dict "context" . "disableSidebar" true "displayPlaceholder" true) }}
{{ partial "toc.html" . }}
<article class="hx-w-full hx-break-words hx-flex hx-min-h-[calc(100vh-var(--navbar-height))] hx-min-w-0 hx-justify-center hx-pb-8 hx-pr-[calc(env(safe-area-inset-right)-1.5rem)]">
<main class="hx-w-full hx-min-w-0 hx-max-w-6xl hx-px-6 hx-pt-4 md:hx-px-12">
<h1 class="hx-text-center hx-mt-2 hx-text-4xl hx-font-bold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100">{{ .Title }}</h1>
<article class="hx:w-full hx:break-words hx:flex hx:min-h-[calc(100vh-var(--navbar-height))] hx:min-w-0 hx:justify-center hx:pb-8 hx:pr-[calc(env(safe-area-inset-right)-1.5rem)]">
<main class="hx:w-full hx:min-w-0 hx:max-w-6xl hx:px-6 hx:pt-4 hx:md:px-12">
{{ if .Title }}<h1 class="hx:text-center hx:mt-2 hx:text-4xl hx:font-bold hx:tracking-tight hx:text-slate-900 hx:dark:text-slate-100">{{ .Title }}</h1>{{ end }}
<div class="content">
{{ .Content }}
</div>
</main>
</article>
</div>
{{ end }}
{{ end }}

8
layouts/partials/breadcrumb.html
View File

@ -1,14 +1,14 @@
{{- if (default true .Params.breadcrumbs) }}
<div class="hx-mt-1.5 hx-flex hx-items-center hx-gap-1 hx-overflow-hidden hx-text-sm hx-text-gray-500 dark:hx-text-gray-400 contrast-more:hx-text-current">
<div class="hx:mt-1.5 hx:flex hx:items-center hx:gap-1 hx:overflow-hidden hx:text-sm hx:text-gray-500 hx:dark:text-gray-400 hx:contrast-more:text-current">
{{- range .Ancestors.Reverse }}
{{- if not .IsHome }}
<div class="hx-whitespace-nowrap hx-transition-colors hx-min-w-[24px] hx-overflow-hidden hx-text-ellipsis hover:hx-text-gray-900 dark:hover:hx-text-gray-100">
<div class="hx:whitespace-nowrap hx:transition-colors hx:min-w-[24px] hx:overflow-hidden hx:text-ellipsis hx:hover:text-gray-900 hx:dark:hover:text-gray-100">
<a href="{{ .RelPermalink }}">{{- partial "utils/title" . -}}</a>
</div>
{{- partial "utils/icon.html" (dict "name" "chevron-right" "attributes" "class=\"hx-w-3.5 hx-shrink-0 rtl:-hx-rotate-180\"") -}}
{{- partial "utils/icon.html" (dict "name" "chevron-right" "attributes" "class=\"hx:w-3.5 hx:shrink-0 hx:rtl:-rotate-180\"") -}}
{{ end -}}
{{ end -}}
<div class="hx-whitespace-nowrap hx-transition-colors hx-font-medium hx-text-gray-700 contrast-more:hx-font-bold contrast-more:hx-text-current dark:hx-text-gray-100 contrast-more:dark:hx-text-current">
<div class="hx:whitespace-nowrap hx:transition-colors hx:font-medium hx:text-gray-700 hx:contrast-more:font-bold hx:contrast-more:text-current hx:dark:text-gray-100 hx:contrast-more:dark:text-current">
{{- partial "utils/title" . -}}
</div>
</div>

8
layouts/partials/components/codeblock-copy-button.html
View File

@ -4,12 +4,12 @@
{{- $copyCode := (T "copyCode") | default "Copy code" -}}
<div class="hextra-code-copy-btn-container {{ if eq $display `hover` }}hx-opacity-0{{ end }} hx-transition group-hover/code:hx-opacity-100 hx-flex hx-gap-1 hx-absolute hx-m-[11px] hx-right-0 {{ if $filename }}hx-top-8{{ else }}hx-top-0{{ end }}">
<div class="hextra-code-copy-btn-container {{ if eq $display `hover` }}hx:opacity-0{{ end }} hx:transition hx:group-hover/code:opacity-100 hx:flex hx:gap-1 hx:absolute hx:m-[11px] hx:right-0 {{ if $filename }}hx:top-8{{ else }}hx:top-0{{ end }}">
<button
class="hextra-code-copy-btn hx-group/copybtn hx-transition-all active:hx-opacity-50 hx-bg-primary-700/5 hx-border hx-border-black/5 hx-text-gray-600 hover:hx-text-gray-900 hx-rounded-md hx-p-1.5 dark:hx-bg-primary-300/10 dark:hx-border-white/10 dark:hx-text-gray-400 dark:hover:hx-text-gray-50"
class="hextra-code-copy-btn hx:group/copybtn hx:cursor-pointer hx:transition-all hx:active:opacity-50 hx:bg-primary-700/5 hx:border hx:border-black/5 hx:text-gray-600 hx:hover:text-gray-900 hx:rounded-md hx:p-1.5 hx:dark:bg-primary-300/10 hx:dark:border-white/10 hx:dark:text-gray-400 hx:dark:hover:text-gray-50"
title="{{ $copyCode }}"
>
<div class="copy-icon group-[.copied]/copybtn:hx-hidden hx-pointer-events-none hx-h-4 hx-w-4"></div>
<div class="success-icon hx-hidden group-[.copied]/copybtn:hx-block hx-pointer-events-none hx-h-4 hx-w-4"></div>
<div class="copy-icon hx:group-[.copied]/copybtn:hidden hx:pointer-events-none hx:h-4 hx:w-4"></div>
<div class="success-icon hx:hidden hx:group-[.copied]/copybtn:block hx:pointer-events-none hx:h-4 hx:w-4"></div>
</button>
</div>

20
layouts/partials/components/codeblock.html
View File

@ -1,13 +1,29 @@
{{ $filename := .filename | default "" -}}
{{ $base_url := .base_url | default "" -}}
{{ $lang := .lang | default "" }}
{{ $content := .content }}
{{ $options := .options | default (dict) }}
{{- if $filename -}}
<div class="filename" dir="auto">{{ $filename }}</div>
<div class="filename not-prose" dir="auto">
{{- if $base_url -}}
{{- $base_url = strings.TrimSuffix "/" $base_url -}}
{{- $filename = strings.TrimPrefix "/" $filename -}}
{{- $file_url := urls.JoinPath $base_url $filename -}}
<a class="hx:no-underline hx:inline-flex hx:items-center hx:gap-1" href="{{ $file_url }}" target="_blank" rel="noopener noreferrer">
<span>{{- $filename -}}</span>
{{- partial "utils/icon" (dict "name" "external-link" "attributes" "height=1em") -}}
</a>
{{- else -}}
{{- $filename -}}
{{- end -}}
</div>
{{- end -}}
{{- if transform.CanHighlight $lang -}}
<div>{{- highlight $content $lang $options -}}</div>
{{- else -}}
<pre><code>{{ $content }}</code></pre>
<div><pre><code>{{ $content }}</code></pre></div>
{{- end -}}

11
layouts/partials/components/giscus.html
View File

@ -8,9 +8,18 @@
* This solution was created with reference to:
* https://github.com/giscus/giscus/issues/336#issuecomment-1214366281
*/
function getGiscusTheme() {
function getHugoTheme() {
return localStorage.getItem("color-theme");
}
function getGiscusTheme() {
let giscusTheme = "{{ (string .theme) | default `light` }}";
if(getHugoTheme() == 'light') {
return giscusTheme.replace('dark', 'light');
} else {
return giscusTheme.replace('light', 'dark');
}
}
function setGiscusTheme() {
function sendMessage(message) {

42
layouts/partials/components/github-style-alert.html Normal file
View File

@ -0,0 +1,42 @@
{{- $content := .content -}}
{{- $alertType := .alertType -}}
{{- $alertTitle := .alertTitle -}}
{{- $icons := dict
"note" "information-circle"
"tip" "light-bulb"
"important" "information-circle"
"warning" "exclamation"
"caution" "exclamation-circle"
-}}
{{- $icon := index $icons $alertType -}}
{{- $title := or $alertTitle (or (i18n $alertType) (title $alertType)) -}}
{{- $defaultClass := "hx:border-orange-100 hx:bg-orange-50 hx:text-orange-800 hx:dark:border-orange-400/30 hx:dark:bg-orange-400/20 hx:dark:text-orange-300" }}
{{- $alertClasses := dict
"note" "hx:border-blue-200 hx:bg-blue-100 hx:text-blue-900 hx:dark:border-blue-200/30 hx:dark:bg-blue-900/30 hx:dark:text-blue-200"
"tip" "hx:border-green-200 hx:bg-green-100 hx:text-green-900 hx:dark:border-green-200/30 hx:dark:bg-green-900/30 hx:dark:text-green-200"
"important" "hx:border-indigo-200 hx:bg-indigo-100 hx:text-indigo-900 hx:dark:border-indigo-200/30 hx:dark:bg-indigo-900/30 hx:dark:text-indigo-200"
"warning" "hx:border-amber-200 hx:bg-amber-100 hx:text-amber-900 hx:dark:border-amber-200/30 hx:dark:bg-amber-900/30 hx:dark:text-amber-200"
"caution" "hx:border-red-200 hx:bg-red-100 hx:text-red-900 hx:dark:border-red-200/30 hx:dark:bg-red-900/30 hx:dark:text-red-200"
-}}
{{- $class := index $alertClasses $alertType | default $defaultClass -}}
<div class="hx:overflow-x-auto hx:mt-6 hx:flex hx:flex-col hx:rounded-lg hx:border hx:py-4 hx:px-4 hx:border-gray-200 hx:contrast-more:border-current hx:contrast-more:dark:border-current {{ $class }}">
<p class="hx:flex hx:items-center hx:font-medium">
{{- with $icon -}}
{{- partial "utils/icon.html" (dict "name" . "attributes" `height=16px class="hx:inline-block hx:align-middle hx:mr-2"`) -}}
{{- end -}}
{{- $title -}}
</p>
<div class="hx:w-full hx:min-w-0 hx:leading-7">
<div class="hx:mt-6 hx:leading-7 hx:first:mt-0">
{{- $content -}}
</div>
</div>
</div>

6
layouts/partials/components/last-updated.html
View File

@ -3,10 +3,10 @@
{{- if site.Params.displayUpdatedDate -}}
{{- with .Lastmod -}}
{{ $datetime := (time.Format "2006-01-02T15:04:05.000Z" .) }}
<div class="hx-mt-12 hx-mb-8 hx-block hx-text-xs hx-text-gray-500 ltr:hx-text-right rtl:hx-text-left dark:hx-text-gray-400">{{ $lastUpdated }} <time datetime="{{ $datetime }}">{{ partial "utils/format-date" . }}</time></div>
<div class="hx:mt-12 hx:mb-8 hx:block hx:text-xs hx:text-gray-500 hx:ltr:text-right hx:rtl:text-left hx:dark:text-gray-400">{{ $lastUpdated }} <time datetime="{{ $datetime }}">{{ partial "utils/format-date" . }}</time></div>
{{- else -}}
<div class="hx-mt-16"></div>
<div class="hx:mt-16"></div>
{{- end -}}
{{- else -}}
<div class="hx-mt-16"></div>
<div class="hx:mt-16"></div>
{{- end -}}

10
layouts/partials/components/pager.html
View File

@ -26,15 +26,15 @@
{{- end -}}
{{- if or $prev $next -}}
<div class="hx-mb-8 hx-flex hx-items-center hx-border-t hx-pt-8 dark:hx-border-neutral-800 contrast-more:hx-border-neutral-400 dark:contrast-more:hx-border-neutral-400 print:hx-hidden">
<div class="hx:mb-8 hx:flex hx:items-center hx:border-t hx:pt-8 hx:border-gray-200 hx:dark:border-neutral-800 hx:contrast-more:border-neutral-400 hx:dark:contrast-more:border-neutral-400 hx:print:hidden">
{{- if $prev -}}
{{- $linkTitle := partial "utils/title" $prev -}}
<a
href="{{ $prev.RelPermalink }}"
title="{{ $linkTitle }}"
class="hx-flex hx-max-w-[50%] hx-items-center hx-gap-1 hx-py-4 hx-text-base hx-font-medium hx-text-gray-600 hx-transition-colors [word-break:break-word] hover:hx-text-primary-600 dark:hx-text-gray-300 md:hx-text-lg ltr:hx-pr-4 rtl:hx-pl-4"
class="hx:flex hx:max-w-[50%] hx:items-center hx:gap-1 hx:py-4 hx:text-base hx:font-medium hx:text-gray-600 hx:transition-colors [word-break:break-word] hx:hover:text-primary-600 hx:dark:text-gray-300 hx:md:text-lg hx:ltr:pr-4 hx:rtl:pl-4"
>
{{- partial "utils/icon.html" (dict "name" "chevron-right" "attributes" "class=\"hx-inline hx-h-5 hx-shrink-0 ltr:hx-rotate-180\"") -}}
{{- partial "utils/icon.html" (dict "name" "chevron-right" "attributes" "class=\"hx:inline hx:h-5 hx:shrink-0 hx:ltr:rotate-180\"") -}}
{{- $linkTitle -}}
</a>
{{- end -}}
@ -43,10 +43,10 @@
<a
href="{{ $next.RelPermalink }}"
title="{{ $linkTitle }}"
class="hx-flex hx-max-w-[50%] hx-items-center hx-gap-1 hx-py-4 hx-text-base hx-font-medium hx-text-gray-600 hx-transition-colors [word-break:break-word] hover:hx-text-primary-600 dark:hx-text-gray-300 md:hx-text-lg ltr:hx-ml-auto ltr:hx-pl-4 ltr:hx-text-right rtl:hx-mr-auto rtl:hx-pr-4 rtl:hx-text-left"
class="hx:flex hx:max-w-[50%] hx:items-center hx:gap-1 hx:py-4 hx:text-base hx:font-medium hx:text-gray-600 hx:transition-colors [word-break:break-word] hx:hover:text-primary-600 hx:dark:text-gray-300 hx:md:text-lg hx:ltr:ml-auto hx:ltr:pl-4 hx:ltr:text-right hx:rtl:mr-auto hx:rtl:pr-4 hx:rtl:text-left"
>
{{- $linkTitle -}}
{{- partial "utils/icon.html" (dict "name" "chevron-right" "attributes" "class=\"hx-inline hx-h-5 hx-shrink-0 rtl:-hx-rotate-180\"") -}}
{{- partial "utils/icon.html" (dict "name" "chevron-right" "attributes" "class=\"hx:inline hx:h-5 hx:shrink-0 hx:rtl:-rotate-180\"") -}}
</a>
{{- end -}}
</div>

0
layouts/partials/custom/footer.html Normal file
View File

39
layouts/partials/footer.html
View File

@ -1,45 +1,54 @@
{{- $enableFooterSwitches := .Scratch.Get "enableFooterSwitches" | default false -}}
{{- $displayThemeToggle := site.Params.theme.displayToggle | default true -}}
{{- $footerSwitchesVisible := and $enableFooterSwitches (or hugo.IsMultilingual $displayThemeToggle) -}}
{{- $copyrightSectionVisible := or (.Site.Params.footer.displayPoweredBy | default true) .Site.Params.footer.displayCopyright -}}
{{- $copyright := (T "copyright") | default "© 2024 Hextra." -}}
{{- $poweredBy := (T "poweredBy") | default "Powered by Hextra" -}}
{{- $footerWidth := "hx-max-w-screen-xl" -}}
{{- $footerWidth := "hx:max-w-screen-xl" -}}
{{- with .Site.Params.footer.width -}}
{{ if eq . "wide" -}}
{{ $footerWidth = "hx-max-w-[90rem]" -}}
{{ $footerWidth = "hx:max-w-[90rem]" -}}
{{ else if eq . "full" -}}
{{ $footerWidth = "max-w-full" -}}
{{ end -}}
{{- end -}}
<footer class="hextra-footer hx-bg-gray-100 hx-pb-[env(safe-area-inset-bottom)] dark:hx-bg-neutral-900 print:hx-bg-transparent">
{{- if $enableFooterSwitches -}}
<div class="hx-mx-auto hx-flex hx-gap-2 hx-py-2 hx-px-4 {{ $footerWidth }}">
<footer class="hextra-footer hx:bg-gray-100 hx:pb-[env(safe-area-inset-bottom)] hx:dark:bg-neutral-900 hx:print:bg-transparent">
{{- if $footerSwitchesVisible -}}
<div class="hx:mx-auto hx:flex hx:gap-2 hx:py-2 hx:px-4 {{ $footerWidth }}">
{{- partial "language-switch.html" (dict "context" .) -}}
{{- with $displayThemeToggle }}{{ partial "theme-toggle.html" }}{{ end -}}
</div>
{{- if or hugo.IsMultilingual $displayThemeToggle -}}
<hr class="dark:hx-border-neutral-800" />
<hr class="hx:border-gray-200 hx:dark:border-neutral-800" />
{{- end -}}
{{- end -}}
<div
class="{{ $footerWidth }} hx-mx-auto hx-flex hx-justify-center hx-py-12 hx-pl-[max(env(safe-area-inset-left),1.5rem)] hx-pr-[max(env(safe-area-inset-right),1.5rem)] hx-text-gray-600 dark:hx-text-gray-400 md:hx-justify-start"
>
<div class="hx-flex hx-w-full hx-flex-col hx-items-center sm:hx-items-start">
{{- if (.Site.Params.footer.displayPoweredBy | default true) }}<div class="hx-font-semibold">{{ template "theme-credit" $poweredBy }}</div>{{ end }}
{{- if .Site.Params.footer.displayCopyright }}<div class="hx-mt-6 hx-text-xs">{{ $copyright | markdownify }}</div>{{ end }}
<div
class="hextra-custom-footer {{ $footerWidth }} hx:pl-[max(env(safe-area-inset-left),1.5rem)] hx:pr-[max(env(safe-area-inset-right),1.5rem)] hx:text-gray-600 hx:dark:text-gray-400"
>
{{- partial "custom/footer.html" (dict "context" . "switchesVisible" $footerSwitchesVisible "copyrightVisible" $copyrightSectionVisible) -}}
</div>
</div>
{{- if $copyrightSectionVisible -}}
<div
class="{{ $footerWidth }} hx:mx-auto hx:flex hx:justify-center hx:py-12 hx:pl-[max(env(safe-area-inset-left),1.5rem)] hx:pr-[max(env(safe-area-inset-right),1.5rem)] hx:text-gray-600 hx:dark:text-gray-400 hx:md:justify-start"
>
<div class="hx:flex hx:w-full hx:flex-col hx:items-center hx:sm:items-start">
{{- if (.Site.Params.footer.displayPoweredBy | default true) }}<div class="hx:font-semibold">{{ template "theme-credit" $poweredBy }}</div>{{- end -}}
{{- if .Site.Params.footer.displayCopyright }}<div class="hx:mt-6 hx:text-xs">{{ $copyright | markdownify }}</div>{{- end -}}
</div>
</div>
{{- end -}}
</footer>
{{- define "theme-credit" -}}
<a class="hx-flex hx-text-sm hx-items-center hx-gap-1 hx-text-current" target="_blank" rel="noopener noreferrer" title="Hextra Gitea Homepage" href="https://code.mygenius.co/Genius/hextra">
<a class="hx-flex hx-text-sm hx-items-center hx-gap-1 hx-text-current" target="_blank" rel="noopener noreferrer" title="Hextra GitHub Homepage" href="https://github.com/imfing/hextra">
<span>
{{- . | markdownify -}}
{{- if strings.Contains . "Hextra" -}}
{{- partial "utils/icon.html" (dict "name" "hextra" "attributes" `height=1em class="hx-inline-block ltr:hx-ml-1 rtl:hx-mr-1 hx-align-[-2.5px]"`) -}}
{{- partial "utils/icon.html" (dict "name" "hextra" "attributes" `height=1em class="hx:inline-block hx:ltr:ml-1 hx:rtl:mr-1 hx:align-[-2.5px]"`) -}}
{{- end -}}
</span>
</a>

8
layouts/partials/google-analytics.html
View File

@ -1,10 +1,4 @@
{{/* site.GoogleAnalytics is deprecated in Hugo v0.120.0 */}}
{{/* it will be removed in a future version */}}
{{- $gtagID := "" -}}
{{- with site.GoogleAnalytics -}}{{ $gtagID = . }}{{- end -}}
{{- with site.Config.Services.GoogleAnalytics.ID -}}{{ $gtagID = . }}{{- end -}}
{{- with $gtagID }}
{{- with site.Config.Services.GoogleAnalytics.ID }}
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id={{ . }}"></script>
<script>

2
layouts/partials/head-css.html
View File

@ -1,6 +1,6 @@
{{- if and (not hugo.IsProduction) (eq hugo.Environment "theme") }}
{{- $styles := resources.Get "css/styles.css" }}
{{- $styles = $styles | resources.PostCSS (dict "inlineImports" true) }}
{{- $styles = $styles | postCSS (dict "inlineImports" true) }}
<link href="{{ $styles.RelPermalink }}" rel="stylesheet" />
{{- else }}
{{- $styles := resources.Get "css/compiled/main.css" -}}

42
layouts/partials/head.html
View File

@ -6,7 +6,7 @@
{{ else -}}
<meta name="robots" content="noindex, nofollow" />
{{ end -}}
{{ partialCached "favicons.html" . }}
{{ partialCached "favicons.html" . -}}
<title>
{{- if .IsHome -}}
{{ .Site.Title -}}
@ -17,26 +17,25 @@
</title>
<meta name="description" content="{{ partial "utils/page-description.html" . }}" />
{{ with .Params.canonical }}
{{- with .Params.canonical -}}
<link rel="canonical" href="{{ . }}" itemprop="url" />
{{ else }}
{{- else -}}
<link rel="canonical" href="{{ .Permalink }}" itemprop="url" />
{{ end }}
{{- end -}}
{{ partial "opengraph.html" . }}
{{ template "_internal/schema.html" . -}}
{{ template "_internal/twitter_cards.html" . -}}
{{- partial "opengraph.html" . -}}
{{- template "_internal/schema.html" . -}}
{{- template "_internal/twitter_cards.html" . -}}
{{ partialCached "head-css.html" . }}
{{- partialCached "head-css.html" . -}}
<!-- Google Analytics -->
{{- if and (eq hugo.Environment "production") (or .Site.GoogleAnalytics .Site.Config.Services.GoogleAnalytics.ID) }}
{{- if and (eq hugo.Environment "production") .Site.Config.Services.GoogleAnalytics.ID }}
<link rel="preconnect" href="https://www.googletagmanager.com" crossorigin />
{{ partial "google-analytics.html" . }}
{{- end }}
<script>
/* Initialize light/dark mode */
const defaultTheme = '{{ site.Params.theme.default | default `system`}}';
@ -60,5 +59,26 @@
}
</script>
{{ partial "custom/head-end.html" . }}
<!-- KaTeX-->
{{ $noop := .WordCount -}}
{{ if .Page.Store.Get "hasMath" -}}
<!-- TODO: make url configurable -->
{{ $katexBaseUrl := "https://cdn.jsdelivr.net/npm/katex@latest/dist" }}
{{ $katexCssUrl := printf "%s/katex%s.css" $katexBaseUrl (cond hugo.IsProduction ".min" "") -}}
{{ $katexFontPattern := "url(fonts/" }}
{{ $katexFontSubstituted := printf "url(%s/fonts/" $katexBaseUrl }}
{{ with try (resources.GetRemote $katexCssUrl) -}}
{{ with .Err -}}
{{ errorf "Could not retrieve KaTeX css file from %s. Reason: %s." $katexCssUrl . -}}
{{ else with.Value -}}
{{ $katexCssContent := strings.Replace .Content $katexFontPattern $katexFontSubstituted }}
{{ with resources.FromString (printf "css/katex%s.css" (cond hugo.IsProduction ".min" "")) $katexCssContent -}}
<link rel="stylesheet" href="{{- .RelPermalink -}}" integrity="{{- . | fingerprint -}}" crossorigin="anonymous" />
{{ end -}}
{{ end -}}
{{ end -}}
{{ end -}}
{{ partial "custom/head-end.html" . -}}
</head>

14
layouts/partials/language-switch.html
View File

@ -6,33 +6,33 @@
{{- $changeLanguage := (T "changeLanguage") | default "Change language" -}}
{{- if hugo.IsMultilingual -}}
<div class="hx-flex hx-justify-items-start {{ if $grow }}hx-grow{{ end }}">
<div class="hx:flex hx:justify-items-start {{ if $grow }}hx:grow{{ end }}">
<button
title="{{ $changeLanguage }}"
data-state="closed"
class="language-switcher hx-h-7 hx-rounded-md hx-px-2 hx-text-left hx-text-xs hx-font-medium hx-text-gray-600 hx-transition-colors dark:hx-text-gray-400 hover:hx-bg-gray-100 hover:hx-text-gray-900 dark:hover:hx-bg-primary-100/5 dark:hover:hx-text-gray-50 hx-grow"
class="language-switcher hx:cursor-pointer hx:h-7 hx:rounded-md hx:px-2 hx:text-left hx:text-xs hx:font-medium hx:text-gray-600 hx:transition-colors hx:dark:text-gray-400 hx:hover:bg-gray-100 hx:hover:text-gray-900 hx:dark:hover:bg-primary-100/5 hx:dark:hover:text-gray-50 hx:grow"
type="button"
aria-label="{{ $changeLanguage }}"
>
<div class="hx-flex hx-items-center hx-gap-2 hx-capitalize">
<div class="hx:flex hx:items-center hx:gap-2 hx:capitalize">
{{- partial "utils/icon" (dict "name" "globe-alt" "attributes" "height=12") -}}
{{- if not $hideLabel }}<span>{{ site.Language.LanguageName }}</span>{{ end -}}
</div>
</button>
<ul
class="language-options hx-hidden hx-z-20 hx-max-h-64 hx-overflow-auto hx-rounded-md hx-ring-1 hx-ring-black/5 hx-bg-white hx-py-1 hx-text-sm hx-shadow-lg dark:hx-ring-white/20 dark:hx-bg-neutral-800"
class="language-options hx:hidden hx:z-20 hx:max-h-64 hx:overflow-auto hx:rounded-md hx:ring-1 hx:ring-black/5 hx:bg-white hx:py-1 hx:text-sm hx:shadow-lg hx:dark:ring-white/20 hx:dark:bg-neutral-800"
style="position: fixed; inset: auto auto 0px 0px; margin: 0px; min-width: 100px;"
>
{{ range site.Languages }}
{{ $link := partial "utils/lang-link" (dict "lang" .Lang "context" $page) }}
<li class="hx-flex hx-flex-col">
<li class="hx:flex hx:flex-col">
<a
href="{{ $link }}"
class="hx-text-gray-800 dark:hx-text-gray-100 hover:hx-bg-primary-50 hover:hx-text-primary-600 hover:dark:hx-bg-primary-500/10 hover:dark:hx-text-primary-600 hx-relative hx-cursor-pointer hx-whitespace-nowrap hx-py-1.5 hx-transition-colors ltr:hx-pl-3 ltr:hx-pr-9 rtl:hx-pr-3 rtl:hx-pl-9"
class="hx:text-gray-800 hx:dark:text-gray-100 hx:hover:bg-primary-50 hx:hover:text-primary-600 hx:hover:dark:bg-primary-500/10 hx:hover:dark:text-primary-600 hx:relative hx:cursor-pointer hx:whitespace-nowrap hx:py-1.5 hx:transition-colors hx:ltr:pl-3 hx:ltr:pr-9 hx:rtl:pr-3 hx:rtl:pl-9"
>
{{- .LanguageName -}}
{{- if eq .LanguageName site.Language.LanguageName -}}
<span class="hx-absolute hx-inset-y-0 hx-flex hx-items-center ltr:hx-right-3 rtl:hx-left-3">
<span class="hx:absolute hx:inset-y-0 hx:flex hx:items-center hx:ltr:right-3 hx:rtl:left-3">
{{- partial "utils/icon" (dict "name" "check" "attributes" "height=1em width=1em") -}}
</span>
{{- end -}}

34
layouts/partials/navbar.html
View File

@ -4,26 +4,26 @@
{{- $logoHeight := .Site.Params.navbar.logo.height | default "20" -}}
{{- $logoDarkPath := .Site.Params.navbar.logo.dark | default $logoPath -}}
{{- $navWidth := "hx-max-w-[90rem]" -}}
{{- $navWidth := "hx:max-w-[90rem]" -}}
{{- with .Site.Params.navbar.width -}}
{{ if eq . "normal" -}}
{{ $navWidth = "hx-max-w-screen-xl" -}}
{{ $navWidth = "hx:max-w-screen-xl" -}}
{{ else if eq . "full" -}}
{{ $navWidth = "max-w-full" -}}
{{ end -}}
{{- end -}}
<div class="nav-container hx-sticky hx-top-0 hx-z-20 hx-w-full hx-bg-transparent print:hx-hidden">
<div class="nav-container-blur hx-pointer-events-none hx-absolute hx-z-[-1] hx-h-full hx-w-full hx-bg-white dark:hx-bg-dark hx-shadow-[0_2px_4px_rgba(0,0,0,.02),0_1px_0_rgba(0,0,0,.06)] contrast-more:hx-shadow-[0_0_0_1px_#000] dark:hx-shadow-[0_-1px_0_rgba(255,255,255,.1)_inset] contrast-more:dark:hx-shadow-[0_0_0_1px_#fff]"></div>
<div class="nav-container hx:sticky hx:top-0 hx:z-20 hx:w-full hx:bg-transparent hx:print:hidden">
<div class="nav-container-blur hx:pointer-events-none hx:absolute hx:z-[-1] hx:h-full hx:w-full hx:bg-white hx:dark:bg-dark hx:shadow-[0_2px_4px_rgba(0,0,0,.02),0_1px_0_rgba(0,0,0,.06)] hx:contrast-more:shadow-[0_0_0_1px_#000] hx:dark:shadow-[0_-1px_0_rgba(255,255,255,.1)_inset] hx:contrast-more:dark:shadow-[0_0_0_1px_#fff]"></div>
<nav class="hx-mx-auto hx-flex hx-items-center hx-justify-end hx-gap-2 hx-h-16 hx-px-6 {{ $navWidth }}">
<a class="hx-flex hx-items-center hover:hx-opacity-75 ltr:hx-mr-auto rtl:hx-ml-auto" href="{{ $logoLink }}">
<nav class="hx:mx-auto hx:flex hx:items-center hx:justify-end hx:gap-2 hx:h-16 hx:px-6 {{ $navWidth }}">
<a class="hx:flex hx:items-center hx:hover:opacity-75 hx:ltr:mr-auto hx:rtl:ml-auto" href="{{ $logoLink }}">
{{- if (.Site.Params.navbar.displayLogo | default true) }}
<img class="hx-block dark:hx-hidden" src="{{ $logoPath | relURL }}" alt="{{ .Site.Title }}" height="{{ $logoHeight }}" width="{{ $logoWidth }}" />
<img class="hx-hidden dark:hx-block" src="{{ $logoDarkPath | relURL }}" alt="{{ .Site.Title }}" height="{{ $logoHeight }}" width="{{ $logoWidth }}" />
<img class="hx:mr-2 hx:block hx:dark:hidden" src="{{ $logoPath | relURL }}" alt="{{ .Site.Title }}" height="{{ $logoHeight }}" width="{{ $logoWidth }}" />
<img class="hx:mr-2 hx:hidden hx:dark:block" src="{{ $logoDarkPath | relURL }}" alt="{{ .Site.Title }}" height="{{ $logoHeight }}" width="{{ $logoWidth }}" />
{{- end }}
{{- if (.Site.Params.navbar.displayTitle | default true) }}
<span class="hx-mx-2 hx-font-extrabold hx-inline hx-select-none" title="{{ .Site.Title }}">{{- .Site.Title -}}</span>
<span class="hx:mr-2 hx:font-extrabold hx:inline hx:select-none" title="{{ .Site.Title }}">{{- .Site.Title -}}</span>
{{- end }}
</a>
@ -42,28 +42,28 @@
{{/* Display icon menu item */}}
{{- if .Params.icon -}}
{{- $rel := cond (eq .Params.icon "mastodon") "noreferer me" "noreferer" }}
<a class="hx-p-2 hx-text-current" {{ if $external }}target="_blank" rel="{{ $rel }}"{{ end }} href="{{ $link }}" title="{{ or (T .Identifier) .Name | safeHTML }}">
{{- $rel := cond (eq .Params.icon "mastodon") "noreferrer me" "noreferrer" }}
<a class="hx:p-2 hx:text-current" {{ if $external }}target="_blank" rel="{{ $rel }}"{{ end }} href="{{ $link }}" title="{{ or (T .Identifier) .Name | safeHTML }}">
{{- partial "utils/icon.html" (dict "name" .Params.icon "attributes" "height=24") -}}
<span class="hx-sr-only">{{ or (T .Identifier) .Name | safeHTML }}</span>
<span class="hx:sr-only">{{ or (T .Identifier) .Name | safeHTML }}</span>
</a>
{{- else -}}
{{- $active := or ($currentPage.HasMenuCurrent "main" .) ($currentPage.IsMenuCurrent "main" .) -}}
{{- $activeClass := cond $active "hx-font-medium" "hx-text-gray-600 hover:hx-text-gray-800 dark:hx-text-gray-400 dark:hover:hx-text-gray-200" -}}
{{- $activeClass := cond $active "hx:font-medium" "hx:text-gray-600 hx:hover:text-gray-800 hx:dark:text-gray-400 hx:dark:hover:text-gray-200" -}}
<a
title="{{ or (T .Identifier) .Name | safeHTML }}"
href="{{ $link }}"
{{ if $external }}target="_blank" rel="noreferer"{{ end }}
class="hx-text-sm contrast-more:hx-text-gray-700 contrast-more:dark:hx-text-gray-100 hx-relative -hx-ml-2 hx-hidden hx-whitespace-nowrap hx-p-2 md:hx-inline-block {{ $activeClass }}"
{{ if $external }}target="_blank" rel="noreferrer"{{ end }}
class="hx:text-sm hx:contrast-more:text-gray-700 hx:contrast-more:dark:text-gray-100 hx:relative hx:-ml-2 hx:hidden hx:whitespace-nowrap hx:p-2 hx:md:inline-block {{ $activeClass }}"
>
<span class="hx-text-center">{{ or (T .Identifier) .Name | safeHTML }}</span>
<span class="hx:text-center">{{ or (T .Identifier) .Name | safeHTML }}</span>
</a>
{{- end -}}
{{- end -}}
{{- end -}}
<button type="button" aria-label="Menu" class="hamburger-menu -hx-mr-2 hx-rounded hx-p-2 active:hx-bg-gray-400/20 md:hx-hidden">
<button type="button" aria-label="Menu" class="hamburger-menu hx:cursor-pointer hx:-mr-2 hx:rounded-sm hx:p-2 hx:active:bg-gray-400/20 hx:md:hidden">
{{- partial "utils/icon.html" (dict "name" "hamburger-menu" "attributes" "height=24") -}}
</button>
</nav>

75
layouts/partials/scripts.html
View File

@ -1,75 +1,10 @@
{{- $jsTheme := resources.Get "js/theme.js" | resources.ExecuteAsTemplate "theme.js" . -}}
{{- $jsMenu := resources.Get "js/menu.js" -}}
{{- $jsTabs := resources.Get "js/tabs.js" -}}
{{- $jsLang := resources.Get "js/lang.js" -}}
{{- $jsCodeCopy := resources.Get "js/code-copy.js" -}}
{{- $jsFileTree := resources.Get "js/filetree.js" -}}
{{- $jsSidebar := resources.Get "js/sidebar.js" -}}
{{- $jsBackToTop := resources.Get "js/back-to-top.js" -}}
{{- $scripts := slice $jsTheme $jsMenu $jsCodeCopy $jsTabs $jsLang $jsFileTree $jsSidebar $jsBackToTop | resources.Concat "js/main.js" -}}
{{- if hugo.IsProduction -}}
{{- $scripts = $scripts | minify | fingerprint -}}
{{- end -}}
<script defer src="{{ $scripts.RelPermalink }}" integrity="{{ $scripts.Data.Integrity }}"></script>
{{/* Core scripts (theme, menu, tabs, etc.) */}}
{{- partial "scripts/core.html" . -}}
{{/* Search */}}
{{- if (site.Params.search.enable | default true) -}}
{{- $searchType := site.Params.search.type | default "flexsearch" -}}
{{- if eq $searchType "flexsearch" -}}
{{- $jsSearchScript := printf "%s.search.js" .Language.Lang -}}
{{- $jsSearch := resources.Get "js/flexsearch.js" | resources.ExecuteAsTemplate $jsSearchScript . -}}
{{- if hugo.IsProduction -}}
{{- $jsSearch = $jsSearch | minify | fingerprint -}}
{{- end -}}
{{- $flexSearchJS := resources.Get "lib/flexsearch/flexsearch.bundle.min.js" | fingerprint -}}
<script defer src="{{ $flexSearchJS.RelPermalink }}" integrity="{{ $flexSearchJS.Data.Integrity }}"></script>
<script defer src="{{ $jsSearch.RelPermalink }}" integrity="{{ $jsSearch.Data.Integrity }}"></script>
{{- else -}}
{{- warnf `search type "%s" is not supported` $searchType -}}
{{- end -}}
{{- end -}}
{{- partial "scripts/search.html" . -}}
{{/* Mermaid */}}
{{/* FIXME: need to investigate .Page.Store hasMermaid is set for homepage */}}
{{- if and (.Page.Store.Get "hasMermaid") (not .Page.IsHome) -}}
{{- $mermaidJS := resources.Get "lib/mermaid/mermaid.min.js" | fingerprint -}}
<script defer src="{{ $mermaidJS.RelPermalink }}" integrity="{{ $mermaidJS.Data.Integrity }}"></script>
<script>
document.addEventListener("DOMContentLoaded", function () {
const theme = document.documentElement.classList.contains("dark") ? "dark" : "default";
mermaid.initialize({ startOnLoad: true, theme: theme });
});
</script>
{{- if (.Store.Get "hasMermaid") -}}
{{- partial "scripts/mermaid.html" . -}}
{{- end -}}
{{/* KaTex */}}
{{- if .Page.Params.math -}}
{{- $katexCSS := resources.Get "lib/katex/katex.min.css" | fingerprint -}}
{{- $katexJS := resources.Get "lib/katex/katex.min.js" | fingerprint -}}
{{- $mhchemJS := resources.Get "lib/katex/mhchem.min.js" | fingerprint -}}
{{- $katexAutoRenderJS := resources.Get "lib/katex/auto-render.min.js" | fingerprint -}}
<link type="text/css" rel="stylesheet" href="{{ $katexCSS.RelPermalink }}" integrity="{{ $katexCSS.Data.Integrity }}" />
<script defer src="{{ $katexJS.RelPermalink }}" integrity="{{ $katexJS.Data.Integrity }}"></script>
<script defer src="{{ $katexAutoRenderJS.RelPermalink }}" integrity="{{ $katexAutoRenderJS.Data.Integrity }}"></script>
<script defer src="{{ $mhchemJS.RelPermalink }}" integrity="{{ $mhchemJS.Data.Integrity }}"></script>
{{ $katexFonts := resources.Match "lib/katex/fonts/*" }}
{{- range $katexFonts -}}
{{ .Publish }}
{{- end -}}
<script>
// TODO: make render options configurable
document.addEventListener("DOMContentLoaded", function () {
renderMathInElement(document.body, {
delimiters: [
{ left: "$$", right: "$$", display: true },
{ left: "$", right: "$", display: false },
{ left: "\\(", right: "\\)", display: false },
{ left: "\\[", right: "\\]", display: true },
],
throwOnError: false,
});
});
</script>
{{ end }}

14
layouts/partials/scripts/core.html Normal file
View File

@ -0,0 +1,14 @@
{{- $jsTheme := resources.Get "js/theme.js" | resources.ExecuteAsTemplate "theme.js" . -}}
{{- $jsMenu := resources.Get "js/menu.js" -}}
{{- $jsTabs := resources.Get "js/tabs.js" -}}
{{- $jsLang := resources.Get "js/lang.js" -}}
{{- $jsCodeCopy := resources.Get "js/code-copy.js" -}}
{{- $jsFileTree := resources.Get "js/filetree.js" -}}
{{- $jsSidebar := resources.Get "js/sidebar.js" -}}
{{- $jsBackToTop := resources.Get "js/back-to-top.js" -}}
{{- $scripts := slice $jsTheme $jsMenu $jsCodeCopy $jsTabs $jsLang $jsFileTree $jsSidebar $jsBackToTop | resources.Concat "js/main.js" -}}
{{- if hugo.IsProduction -}}
{{- $scripts = $scripts | minify | fingerprint -}}
{{- end -}}
<script defer src="{{ $scripts.RelPermalink }}" integrity="{{ $scripts.Data.Integrity }}"></script>

44
layouts/partials/scripts/mermaid.html Normal file
View File

@ -0,0 +1,44 @@
{{/* Mermaid */}}
{{ $mermaidJsUrl := printf "https://cdn.jsdelivr.net/npm/mermaid@latest/dist/mermaid%s.js" (cond hugo.IsProduction ".min" "") -}}
{{ with try (resources.GetRemote $mermaidJsUrl) -}}
{{ with .Err -}}
{{ errorf "Could not retrieve Mermaid js file from %s. Reason: %s." $mermaidJsUrl . -}}
{{ else with.Value -}}
{{ with resources.Copy (printf "js/mermaid.min.js") . -}}
{{ $mermaidJs := . | fingerprint -}}
<script defer src="{{ $mermaidJs.RelPermalink }}" integrity="{{ $mermaidJs.Data.Integrity }}" crossorigin="anonymous"></script>
{{ end -}}
{{ end -}}
{{ end -}}
<script>
document.addEventListener("DOMContentLoaded", () => {
// Store original mermaid code for each diagram
document.querySelectorAll(".mermaid").forEach((el) => {
el.dataset.original = el.innerHTML;
});
const theme = document.documentElement.classList.contains("dark") ? "dark" : "default";
mermaid.initialize({ startOnLoad: true, theme: theme });
let timeout;
new MutationObserver(() => {
clearTimeout(timeout);
timeout = setTimeout(() => {
const theme = document.documentElement.classList.contains("dark") ? "dark" : "default";
document.querySelectorAll(".mermaid").forEach((el) => {
// Reset to original content, preserving HTML
el.innerHTML = el.dataset.original;
el.removeAttribute("data-processed");
});
mermaid.initialize({ startOnLoad: true, theme: theme });
mermaid.init();
}, 150);
}).observe(document.documentElement, {
attributes: true,
attributeFilter: ["class"],
});
});
</script>

26
layouts/partials/scripts/search.html Normal file
View File

@ -0,0 +1,26 @@
{{/* Search */}}
{{- if (site.Params.search.enable | default true) -}}
{{- $searchType := site.Params.search.type | default "flexsearch" -}}
{{- if eq $searchType "flexsearch" -}}
{{- $jsSearchScript := printf "%s.search.js" .Language.Lang -}}
{{- $jsSearch := resources.Get "js/flexsearch.js" | resources.ExecuteAsTemplate $jsSearchScript . -}}
{{- if hugo.IsProduction -}}
{{- $jsSearch = $jsSearch | minify | fingerprint -}}
{{- end -}}
{{- $flexSearchVersion := site.Params.search.flexsearch.version | default "0.8.143" -}}
{{- $flexSearchJsUrl := printf "https://cdn.jsdelivr.net/npm/flexsearch@%s/dist/flexsearch.bundle%s.js" $flexSearchVersion (cond hugo.IsProduction ".min" ".debug") -}}
{{ with try (resources.GetRemote $flexSearchJsUrl) -}}
{{ with .Err -}}
{{ errorf "Could not retrieve FlexSearch js file from %s. Reason: %s." $flexSearchJsUrl . -}}
{{ else with.Value -}}
{{ with resources.Copy (printf "js/flexsearch.js") . -}}
{{ $flexSearchJs := . | fingerprint -}}
<script defer src="{{ $flexSearchJs.RelPermalink }}" integrity="{{ $flexSearchJs.Data.Integrity }}" crossorigin="anonymous"></script>
{{ end -}}
{{ end -}}
{{ end -}}
<script defer src="{{ $jsSearch.RelPermalink }}" integrity="{{ $jsSearch.Data.Integrity }}"></script>
{{- else -}}
{{- warnf `search type "%s" is not supported` $searchType -}}
{{- end -}}
{{- end -}}

10
layouts/partials/search.html
View File

@ -1,17 +1,17 @@
{{- $placeholder := (T "searchPlaceholder") | default "Search..." -}}
<div class="search-wrapper hx-relative md:hx-w-64">
<div class="hx-relative hx-flex hx-items-center hx-text-gray-900 contrast-more:hx-text-gray-800 dark:hx-text-gray-300 contrast-more:dark:hx-text-gray-300">
<div class="search-wrapper hx:relative hx:md:w-64">
<div class="hx:relative hx:flex hx:items-center hx:text-gray-900 hx:contrast-more:text-gray-800 hx:dark:text-gray-300 hx:contrast-more:dark:text-gray-300">
<input
placeholder="{{ $placeholder }}"
class="search-input hx-block hx-w-full hx-appearance-none hx-rounded-lg hx-px-3 hx-py-2 hx-transition-colors hx-text-base hx-leading-tight md:hx-text-sm hx-bg-black/[.05] dark:hx-bg-gray-50/10 focus:hx-bg-white dark:focus:hx-bg-dark placeholder:hx-text-gray-500 dark:placeholder:hx-text-gray-400 contrast-more:hx-border contrast-more:hx-border-current"
class="search-input hx:block hx:w-full hx:appearance-none hx:rounded-lg hx:px-3 hx:py-2 hx:transition-colors hx:text-base hx:leading-tight hx:md:text-sm hx:bg-black/[.05] hx:dark:bg-gray-50/10 hx:focus:bg-white hx:dark:focus:bg-dark hx:placeholder:text-gray-500 hx:dark:placeholder:text-gray-400 hx:contrast-more:border hx:contrast-more:border-current"
type="search"
value=""
spellcheck="false"
/>
<kbd
class="hx-absolute hx-my-1.5 hx-select-none ltr:hx-right-1.5 rtl:hx-left-1.5 hx-h-5 hx-rounded hx-bg-white hx-px-1.5 hx-font-mono hx-text-[10px] hx-font-medium hx-text-gray-500 hx-border dark:hx-border-gray-100/20 dark:hx-bg-dark/50 contrast-more:hx-border-current contrast-more:hx-text-current contrast-more:dark:hx-border-current hx-items-center hx-gap-1 hx-transition-opacity hx-pointer-events-none hx-hidden sm:hx-flex"
class="hx:absolute hx:my-1.5 hx:select-none hx:ltr:right-1.5 hx:rtl:left-1.5 hx:h-5 hx:rounded-sm hx:bg-white hx:px-1.5 hx:font-mono hx:text-[10px] hx:font-medium hx:text-gray-500 hx:border hx:border-gray-200 hx:dark:border-gray-100/20 hx:dark:bg-dark/50 hx:contrast-more:border-current hx:contrast-more:text-current hx:contrast-more:dark:border-current hx:items-center hx:gap-1 hx:transition-opacity hx:pointer-events-none hx:hidden hx:sm:flex"
>
CTRL K
</kbd>
@ -19,7 +19,7 @@
<div>
<ul
class="search-results hextra-scrollbar hx-hidden hx-border hx-border-gray-200 hx-bg-white hx-text-gray-100 dark:hx-border-neutral-800 dark:hx-bg-neutral-900 hx-absolute hx-top-full hx-z-20 hx-mt-2 hx-overflow-auto hx-overscroll-contain hx-rounded-xl hx-py-2.5 hx-shadow-xl hx-max-h-[min(calc(50vh-11rem-env(safe-area-inset-bottom)),400px)] md:hx-max-h-[min(calc(100vh-5rem-env(safe-area-inset-bottom)),400px)] hx-inset-x-0 ltr:md:hx-left-auto rtl:md:hx-right-auto contrast-more:hx-border contrast-more:hx-border-gray-900 contrast-more:dark:hx-border-gray-50 hx-w-screen hx-min-h-[100px] hx-max-w-[min(calc(100vw-2rem),calc(100%+20rem))]"
class="search-results hextra-scrollbar hx:hidden hx:border hx:border-gray-200 hx:bg-white hx:text-gray-100 hx:dark:border-neutral-800 hx:dark:bg-neutral-900 hx:absolute hx:top-full hx:z-20 hx:mt-2 hx:overflow-auto hx:overscroll-contain hx:rounded-xl hx:py-2.5 hx:shadow-xl hx:max-h-[min(calc(50vh-11rem-env(safe-area-inset-bottom)),400px)] hx:md:max-h-[min(calc(100vh-5rem-env(safe-area-inset-bottom)),400px)] hx:inset-x-0 hx:ltr:md:left-auto hx:rtl:md:right-auto hx:contrast-more:border hx:contrast-more:border-gray-900 hx:contrast-more:dark:border-gray-50 hx:w-screen hx:min-h-[100px] hx:max-w-[min(calc(100vw-2rem),calc(100%+20rem))]"
style="transition: max-height 0.2s ease 0s;"
></ul>
</div>

20
layouts/partials/shortcodes/badge.html Normal file
View File

@ -0,0 +1,20 @@
{{- $content := .content -}}
{{- $type := .type -}}
{{- $class := .class | default "" -}}
{{- $border := .border | default false -}}
{{- $icon := .icon | default "" -}}
{{- $defaultClass := "hx:text-gray-600 hx:bg-gray-100 hx:dark:bg-neutral-800 hx:dark:text-neutral-200 hx:border-gray-200 hx:dark:border-neutral-700" -}}
{{- $warningClass := "hx:border-yellow-100 hx:bg-yellow-50 hx:text-yellow-900 hx:dark:border-yellow-200/30 hx:dark:bg-yellow-700/30 hx:dark:text-yellow-200" -}}
{{- $infoClass := "hx:border-blue-200 hx:bg-blue-100 hx:text-blue-900 hx:dark:border-blue-200/30 hx:dark:bg-blue-900/30 hx:dark:text-blue-200" -}}
{{- $errorClass := "hx:border-red-200 hx:bg-red-100 hx:text-red-900 hx:dark:border-red-200/30 hx:dark:bg-red-900/30 hx:dark:text-red-200" -}}
{{- $borderClass := cond (eq $border true) "hx:border" "" -}}
{{- $badgeClass := cond (eq $type "info") $infoClass (cond (eq $type "warning") $warningClass (cond (eq $type "error") $errorClass $defaultClass)) -}}
<div class="hextra-badge {{ $class }}">
<div class="hx:inline-flex hx:gap-1 hx:items-center hx:rounded-full hx:px-2.5 hx:leading-6 hx:text-[.65rem] {{ $borderClass }} {{ $badgeClass }}">
{{- with $icon -}}{{- partial "utils/icon" (dict "name" . "attributes" "height=12") -}}{{- end -}}
{{- $content -}}
</div>
</div>
{{- /* Strip trailing newline. */ -}}

28
layouts/partials/shortcodes/callout.html Normal file
View File

@ -0,0 +1,28 @@
{{- $content := .content -}}
{{- $emoji := .emoji -}}
{{- $icon := .icon -}}
{{- $defaultClass := "hx:border-orange-100 hx:bg-orange-50 hx:text-orange-800 hx:dark:border-orange-400/30 hx:dark:bg-orange-400/20 hx:dark:text-orange-300" -}}
{{- $class := .class | default $defaultClass -}}
<div class="hx:overflow-x-auto hx:mt-6 hx:flex hx:rounded-lg hx:border hx:py-2 hx:ltr:pr-4 hx:rtl:pl-4 hx:contrast-more:border-current hx:contrast-more:dark:border-current {{ $class }}">
<div class="hx:ltr:pl-3 hx:ltr:pr-2 hx:rtl:pr-3 hx:rtl:pl-2">
{{- with $emoji -}}
<div class="hx:select-none hx:text-xl" style="font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';">
{{- . -}}
</div>
{{- else -}}
{{- with $icon -}}
{{ partial "utils/icon.html" (dict "name" . "attributes" `height=1.2em class="hx:inline-block hx:align-middle"`) -}}
{{- end -}}
{{- end -}}
</div>
<div class="hx:w-full hx:min-w-0 hx:leading-7">
<div class="hx:mt-6 hx:leading-7 hx:first:mt-0">
{{- $content -}}
</div>
</div>
</div>

26
layouts/partials/shortcodes/card.html
View File

@ -7,10 +7,12 @@
{{- $width := .width -}}
{{- $height := .height -}}
{{- $imageStyle := .imageStyle -}}
{{- $tag := .tag -}}
{{- $tagType := .tagType -}}
{{ $linkClass := "hover:hx-border-gray-300 hx-bg-transparent hx-shadow-sm dark:hx-border-neutral-800 hover:hx-bg-slate-50 hover:hx-shadow-md dark:hover:hx-border-neutral-700 dark:hover:hx-bg-neutral-900" }}
{{ $linkClass := "hx:hover:border-gray-300 hx:bg-transparent hx:shadow-xs hx:dark:border-neutral-800 hx:hover:bg-slate-50 hx:hover:shadow-md hx:dark:hover:border-neutral-700 hx:dark:hover:bg-neutral-900" }}
{{- with $image -}}
{{ $linkClass = "hover:hx-border-gray-300 hx-bg-gray-100 hx-shadow dark:hx-border-neutral-700 dark:hx-bg-neutral-800 dark:hx-text-gray-50 hover:hx-shadow-lg dark:hover:hx-border-neutral-500 dark:hover:hx-bg-neutral-700" }}
{{ $linkClass = "hx:hover:border-gray-300 hx:bg-gray-100 hx:shadow-sm hx:dark:border-neutral-700 hx:dark:bg-neutral-800 hx:dark:text-gray-50 hx:hover:shadow-lg hx:dark:hover:border-neutral-500 hx:dark:hover:bg-neutral-700" }}
{{- end -}}
{{- $external := strings.HasPrefix $link "http" -}}
@ -18,7 +20,7 @@
<a
class="hextra-card hx-group hx-flex hx-flex-col hx-justify-start hx-overflow-hidden hx-rounded-lg hx-border hx-border-gray-200 hx-text-current hx-no-underline dark:hx-shadow-none hover:hx-shadow-gray-100 dark:hover:hx-shadow-none hx-shadow-gray-100 active:hx-shadow-sm active:hx-shadow-gray-200 hx-transition-all hx-duration-200 {{ $linkClass }}"
class="hextra-card hx:group hx:flex hx:flex-col hx:justify-start hx:overflow-hidden hx:rounded-lg hx:border hx:border-gray-200 hx:text-current hx:no-underline hx:dark:shadow-none hx:hover:shadow-gray-100 hx:dark:hover:shadow-none hx:shadow-gray-100 hx:active:shadow-sm hx:active:shadow-gray-200 hx:transition-all hx:duration-200 {{ $linkClass }}"
{{- if $link -}}
href="{{ $href }}"
{{ with $external }}target="_blank" rel="noreferrer"{{ end -}}
@ -37,18 +39,28 @@
/>
{{- end -}}
{{- $padding := "hx-p-4" -}}
{{- $padding := "hx:p-4" -}}
{{- with $subtitle -}}
{{- $padding = "hx-pt-4 hx-px-4" -}}
{{- $padding = "hx:pt-4 hx:px-4" -}}
{{- end -}}
<span class="hextra-card-icon hx-flex hx-font-semibold hx-items-start hx-gap-2 {{ $padding }} hx-text-gray-700 hover:hx-text-gray-900 dark:hx-text-neutral-200 dark:hover:hx-text-neutral-50">
<span class="hextra-card-icon hx:flex hx:font-semibold hx:items-start hx:gap-2 {{ $padding }} hx:text-gray-700 hx:hover:text-gray-900 hx:dark:text-neutral-200 hx:dark:hover:text-neutral-50">
{{- with $icon }}{{ partial "utils/icon.html" (dict "name" $icon) -}}{{- end -}}
{{- $title -}}
</span>
{{- with $subtitle -}}
<div class="hextra-card-subtitle hx-line-clamp-3 hx-text-sm hx-font-normal hx-text-gray-500 dark:hx-text-gray-400 hx-px-4 hx-mb-4 hx-mt-2">{{- $subtitle | markdownify -}}</div>
<div class="hextra-card-subtitle hx:line-clamp-3 hx:text-sm hx:font-normal hx:text-gray-500 hx:dark:text-gray-400 hx:px-4 hx:mb-4 hx:mt-2">{{- $subtitle | markdownify -}}</div>
{{- end -}}
{{- if $tag }}
{{- partial "shortcodes/badge.html" (dict
"content" $tag
"type" $tagType
"class" "hextra-card-tag"
"border" true
)
-}}
{{- end -}}
</a>
{{- /* Strip trailing newline. */ -}}

6
layouts/partials/shortcodes/cards.html Normal file
View File

@ -0,0 +1,6 @@
{{- $cols := .cols | default 3 -}}
{{- $content := .content -}}
<div class="hextra-cards hx:mt-4 hx:gap-4 hx:grid not-prose" style="--hextra-cards-grid-cols: {{ $cols }};">
{{- $content -}}
</div>

59
layouts/partials/sidebar.html
View File

@ -3,7 +3,7 @@
{{- $disableSidebar := .disableSidebar | default false -}}
{{- $displayPlaceholder := .displayPlaceholder | default false -}}
{{- $sidebarClass := cond $disableSidebar (cond $displayPlaceholder "md:hx-hidden xl:hx-block" "md:hx-hidden") "md:hx-sticky" -}}
{{- $sidebarClass := cond $disableSidebar (cond $displayPlaceholder "hx:md:hidden hx:xl:block" "hx:md:hidden") "hx:md:sticky" -}}
{{- $navRoot := cond (eq site.Home.Type "docs") site.Home $context.FirstSection -}}
{{- $pageURL := $context.RelPermalink -}}
@ -15,14 +15,13 @@
{{- end -}}
<div class="mobile-menu-overlay [transition:background-color_1.5s_ease] hx-fixed hx-inset-0 hx-z-10 hx-bg-black/80 dark:hx-bg-black/60 hx-hidden"></div>
<aside class="sidebar-container hx-flex hx-flex-col print:hx-hidden md:hx-top-16 md:hx-shrink-0 md:hx-w-64 md:hx-self-start max-md:[transform:translate3d(0,-100%,0)] {{ $sidebarClass }}">
<aside class="sidebar-container hx:flex hx:flex-col hx:print:hidden hx:md:top-16 hx:md:shrink-0 hx:md:w-64 hx:md:self-start hx:max-md:[transform:translate3d(0,-100%,0)] {{ $sidebarClass }}">
<!-- Search bar on small screen -->
<div class="hx-px-4 hx-pt-4 md:hx-hidden">
<div class="hx:px-4 hx:pt-4 hx:md:hidden">
{{ partial "search.html" }}
</div>
<div class="hextra-scrollbar hx-overflow-y-auto hx-overflow-x-hidden hx-p-4 hx-grow md:hx-h-[calc(100vh-var(--navbar-height)-var(--menu-height))]">
<ul class="hx-flex hx-flex-col hx-gap-1 md:hx-hidden">
<div class="hextra-scrollbar hx:overflow-y-auto hx:overflow-x-hidden hx:p-4 hx:grow hx:md:h-[calc(100vh-var(--navbar-height)-var(--menu-height))]">
<ul class="hx:flex hx:flex-col hx:gap-1 hx:md:hidden">
<!-- Nav -->
{{ template "sidebar-main" (dict "context" site.Home "pageURL" $pageURL "page" $context "toc" true) -}}
{{ template "sidebar-footer" }}
@ -30,27 +29,27 @@
<!-- Sidebar on large screen -->
{{- if $disableSidebar -}}
{{- if $displayPlaceholder }}<div class="max-xl:hx-hidden hx-h-0 hx-w-64 hx-shrink-0"></div>{{ end -}}
{{- if $displayPlaceholder }}<div class="hx:max-xl:hidden hx:h-0 hx:w-64 hx:shrink-0"></div>{{ end -}}
{{ .context.Scratch.Set "enableFooterSwitches" true }}
{{- else -}}
<ul class="hx-flex hx-flex-col hx-gap-1 max-md:hx-hidden">
<ul class="hx:flex hx:flex-col hx:gap-1 hx:max-md:hidden">
{{ template "sidebar-main" (dict "context" $navRoot "page" $context "pageURL" $pageURL) }}
{{ template "sidebar-footer" }}
</ul>
{{ end -}}
</div>
{{/* Hide theme switch when sidebar is disabled */}}
{{ $switchesClass := cond $disableSidebar "md:hx-hidden" "" -}}
{{ $switchesClass := cond $disableSidebar "hx:md:hidden" "" -}}
{{ $displayThemeToggle := (site.Params.theme.displayToggle | default true) -}}
{{ if or hugo.IsMultilingual $displayThemeToggle }}
<div class="{{ $switchesClass }} {{ with hugo.IsMultilingual }}hx-justify-end{{ end }} hx-sticky hx-bottom-0 hx-bg-white dark:hx-bg-dark hx-mx-4 hx-py-4 hx-shadow-[0_-12px_16px_#fff] hx-flex hx-items-center hx-gap-2 dark:hx-border-neutral-800 dark:hx-shadow-[0_-12px_16px_#111] contrast-more:hx-border-neutral-400 contrast-more:hx-shadow-none contrast-more:dark:hx-shadow-none hx-border-t" data-toggle-animation="show">
<div class="{{ $switchesClass }} {{ with hugo.IsMultilingual }}hx:justify-end{{ end }} hx:sticky hx:bottom-0 hx:bg-white hx:dark:bg-dark hx:mx-4 hx:py-4 hx:shadow-[0_-12px_16px_#fff] hx:flex hx:items-center hx:gap-2 hx:border-gray-200 hx:dark:border-neutral-800 hx:dark:shadow-[0_-12px_16px_#111] hx:contrast-more:border-neutral-400 hx:contrast-more:shadow-none hx:contrast-more:dark:shadow-none hx:border-t" data-toggle-animation="show">
{{- with hugo.IsMultilingual -}}
{{- partial "language-switch" (dict "context" $context "grow" true) -}}
{{- with $displayThemeToggle }}{{ partial "theme-toggle" (dict "hideLabel" true) }}{{ end -}}
{{- else -}}
{{- with $displayThemeToggle -}}
<div class="hx-flex hx-grow hx-flex-col">{{ partial "theme-toggle" }}</div>
<div class="hx:flex hx:grow hx:flex-col">{{ partial "theme-toggle" }}</div>
{{- end -}}
{{- end -}}
</div>
@ -77,8 +76,8 @@
{{- if eq $level 0 -}}
{{- range $items.ByWeight }}
{{- if .Params.sidebar.separator -}}
<li class="[word-break:break-word] hx-mt-5 hx-mb-2 hx-px-2 hx-py-1.5 hx-text-sm hx-font-semibold hx-text-gray-900 first:hx-mt-0 dark:hx-text-gray-100">
<span class="hx-cursor-default">{{ partial "utils/title" . }}</span>
<li class="[word-break:break-word] hx:mt-5 hx:mb-2 hx:px-2 hx:py-1.5 hx:text-sm hx:font-semibold hx:text-gray-900 hx:first:mt-0 hx:dark:text-gray-100">
<span class="hx:cursor-default">{{ partial "utils/title" . }}</span>
</li>
{{- else -}}
{{- $active := eq $pageURL .RelPermalink -}}
@ -94,13 +93,13 @@
{{- end -}}
{{- end -}}
{{- else -}}
<div class="ltr:hx-pr-0 hx-overflow-hidden">
<ul class='hx-relative hx-flex hx-flex-col hx-gap-1 before:hx-absolute before:hx-inset-y-1 before:hx-w-px before:hx-bg-gray-200 before:hx-content-[""] ltr:hx-ml-3 ltr:hx-pl-3 ltr:before:hx-left-0 rtl:hx-mr-3 rtl:hx-pr-3 rtl:before:hx-right-0 dark:before:hx-bg-neutral-800'>
<div class="hx:ltr:pr-0 hx:overflow-hidden">
<ul class='hx:relative hx:flex hx:flex-col hx:gap-1 hx:before:absolute hx:before:inset-y-1 hx:before:w-px hx:before:bg-gray-200 hx:before:content-[""] hx:ltr:ml-3 hx:ltr:pl-3 hx:ltr:before:left-0 hx:rtl:mr-3 hx:rtl:pr-3 hx:rtl:before:right-0 hx:dark:before:bg-neutral-800'>
{{- range $items.ByWeight }}
{{- $active := eq $pageURL .RelPermalink -}}
{{- $shouldOpen := or (.Params.sidebar.open) (.IsAncestor $page) $active | default true }}
{{- $linkTitle := partial "utils/title" . -}}
<li class="hx-flex hx-flex-col {{ if $shouldOpen }}open{{ end }}">
<li class="hx:flex hx:flex-col {{ if $shouldOpen }}open{{ end }}">
{{- template "sidebar-item-link" dict "context" . "active" $active "title" $linkTitle "link" .RelPermalink -}}
{{- if and $toc $active -}}
{{ template "sidebar-toc" dict "page" . }}
@ -117,16 +116,16 @@
{{- define "sidebar-toc" -}}
{{ $page := .page }}
{{ with $page.Fragments.Headings }}
<ul class='hx-flex hx-flex-col hx-gap-1 hx-relative before:hx-absolute before:hx-inset-y-1 before:hx-w-px before:hx-bg-gray-200 before:hx-content-[""] dark:before:hx-bg-neutral-800 ltr:hx-pl-3 ltr:before:hx-left-0 rtl:hx-pr-3 rtl:before:hx-right-0 ltr:hx-ml-3 rtl:hx-mr-3'>
<ul class='hx:flex hx:flex-col hx:gap-1 hx:relative hx:before:absolute hx:before:inset-y-1 hx:before:w-px hx:before:bg-gray-200 hx:before:content-[""] hx:dark:before:bg-neutral-800 hx:ltr:pl-3 hx:ltr:before:left-0 hx:rtl:pr-3 hx:rtl:before:right-0 hx:ltr:ml-3 hx:rtl:mr-3'>
{{- range . }}
{{- with .Headings }}
{{- range . -}}
<li>
<a
href="#{{ anchorize .ID }}"
class="hx-flex hx-rounded hx-px-2 hx-py-1.5 hx-text-sm hx-transition-colors [word-break:break-word] hx-cursor-pointer [-webkit-tap-highlight-color:transparent] [-webkit-touch-callout:none] contrast-more:hx-border hx-gap-2 before:hx-opacity-25 before:hx-content-['#'] hx-text-gray-500 hover:hx-bg-gray-100 hover:hx-text-gray-900 dark:hx-text-neutral-400 dark:hover:hx-bg-primary-100/5 dark:hover:hx-text-gray-50 contrast-more:hx-text-gray-900 contrast-more:dark:hx-text-gray-50 contrast-more:hx-border-transparent contrast-more:hover:hx-border-gray-900 contrast-more:dark:hover:hx-border-gray-50"
class="hx:flex hx:rounded-sm hx:px-2 hx:py-1.5 hx:text-sm hx:transition-colors [word-break:break-word] hx:cursor-pointer [-webkit-tap-highlight-color:transparent] [-webkit-touch-callout:none] hx:contrast-more:border hx:gap-2 hx:before:opacity-25 hx:before:content-['#'] hx:text-gray-500 hx:hover:bg-gray-100 hx:hover:text-gray-900 hx:dark:text-neutral-400 hx:dark:hover:bg-primary-100/5 hx:dark:hover:text-gray-50 hx:contrast-more:text-gray-900 hx:contrast-more:dark:text-gray-50 hx:contrast-more:border-transparent hx:contrast-more:hover:border-gray-900 hx:contrast-more:dark:hover:border-gray-50"
>
{{- .Title -}}
{{- .Title | safeHTML | plainify | htmlUnescape -}}
</a>
</li>
{{ end -}}
@ -140,11 +139,17 @@
{{- range site.Menus.sidebar -}}
{{- $name := or (T .Identifier) .Name -}}
{{ if eq .Params.type "separator" }}
<li class="[word-break:break-word] hx-mt-5 hx-mb-2 hx-px-2 hx-py-1.5 hx-text-sm hx-font-semibold hx-text-gray-900 first:hx-mt-0 dark:hx-text-gray-100">
<span class="hx-cursor-default">{{ $name }}</span>
<li class="[word-break:break-word] hx:mt-5 hx:mb-2 hx:px-2 hx:py-1.5 hx:text-sm hx:font-semibold hx:text-gray-900 hx:first:mt-0 hx:dark:text-gray-100">
<span class="hx:cursor-default">{{ $name }}</span>
</li>
{{ else }}
<li>{{ template "sidebar-item-link" dict "active" false "title" $name "link" (.URL | relLangURL) }}</li>
{{- $link := .URL -}}
{{- with .PageRef -}}
{{- if hasPrefix . "/" -}}
{{- $link = relLangURL (strings.TrimPrefix "/" .) -}}
{{- end -}}
{{- end -}}
<li>{{ template "sidebar-item-link" dict "active" false "title" $name "link" $link }}</li>
{{ end }}
{{- end -}}
{{- end -}}
@ -153,14 +158,14 @@
{{- $external := strings.HasPrefix .link "http" -}}
{{- $open := .open | default true -}}
<a
class="hx-flex hx-items-center hx-justify-between hx-gap-2 hx-cursor-pointer hx-rounded hx-px-2 hx-py-1.5 hx-text-sm hx-transition-colors [-webkit-tap-highlight-color:transparent] [-webkit-touch-callout:none] [word-break:break-word]
class="hx:flex hx:items-center hx:justify-between hx:gap-2 hx:cursor-pointer hx:rounded-sm hx:px-2 hx:py-1.5 hx:text-sm hx:transition-colors [-webkit-tap-highlight-color:transparent] [-webkit-touch-callout:none] [word-break:break-word]
{{- if .active }}
sidebar-active-item hx-bg-primary-100 hx-font-semibold hx-text-primary-800 contrast-more:hx-border contrast-more:hx-border-primary-500 dark:hx-bg-primary-400/10 dark:hx-text-primary-600 contrast-more:dark:hx-border-primary-500
sidebar-active-item hx:bg-primary-100 hx:font-semibold hx:text-primary-800 hx:contrast-more:border hx:contrast-more:border-primary-500 hx:dark:bg-primary-400/10 hx:dark:text-primary-600 hx:contrast-more:dark:border-primary-500
{{- else }}
hx-text-gray-500 hover:hx-bg-gray-100 hover:hx-text-gray-900 contrast-more:hx-border contrast-more:hx-border-transparent contrast-more:hx-text-gray-900 contrast-more:hover:hx-border-gray-900 dark:hx-text-neutral-400 dark:hover:hx-bg-primary-100/5 dark:hover:hx-text-gray-50 contrast-more:dark:hx-text-gray-50 contrast-more:dark:hover:hx-border-gray-50
hx:text-gray-500 hx:hover:bg-gray-100 hx:hover:text-gray-900 hx:contrast-more:border hx:contrast-more:border-transparent hx:contrast-more:text-gray-900 hx:contrast-more:hover:border-gray-900 hx:dark:text-neutral-400 hx:dark:hover:bg-primary-100/5 hx:dark:hover:text-gray-50 hx:contrast-more:dark:text-gray-50 hx:contrast-more:dark:hover:border-gray-50
{{- end -}}"
href="{{ .link }}"
{{ if $external }}target="_blank" rel="noreferer"{{ end }}
{{ if $external }}target="_blank" rel="noreferrer"{{ end }}
>
{{- .title -}}
{{- with .context }}
@ -174,5 +179,5 @@
{{- end -}}
{{- define "sidebar-collapsible-button" -}}
<svg fill="none" viewBox="0 0 24 24" stroke="currentColor" class="hx-h-[18px] hx-min-w-[18px] hx-rounded-sm hx-p-0.5 hover:hx-bg-gray-800/5 dark:hover:hx-bg-gray-100/5"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" class="hx-origin-center hx-transition-transform rtl:-hx-rotate-180"></path></svg>
<svg fill="none" viewBox="0 0 24 24" stroke="currentColor" class="hx:h-[18px] hx:min-w-[18px] hx:rounded-xs hx:p-0.5 hx:hover:bg-gray-800/5 hx:dark:hover:bg-gray-100/5"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" class="hx:origin-center hx:transition-transform hx:rtl:-rotate-180"></path></svg>
{{- end -}}

12
layouts/partials/theme-toggle.html
View File

@ -8,14 +8,14 @@
<button
title="{{ $changeTheme }}"
data-theme="light"
class="theme-toggle hx-group hx-h-7 hx-rounded-md hx-px-2 hx-text-left hx-text-xs hx-font-medium hx-text-gray-600 hx-transition-colors dark:hx-text-gray-400 hover:hx-bg-gray-100 hover:hx-text-gray-900 dark:hover:hx-bg-primary-100/5 dark:hover:hx-text-gray-50"
class="theme-toggle hx:cursor-pointer hx:group hx:h-7 hx:rounded-md hx:px-2 hx:text-left hx:text-xs hx:font-medium hx:text-gray-600 hx:transition-colors hx:dark:text-gray-400 hx:hover:bg-gray-100 hx:hover:text-gray-900 hx:dark:hover:bg-primary-100/5 hx:dark:hover:text-gray-50"
type="button"
aria-label="{{ $changeTheme }}"
>
<div class="hx-flex hx-items-center hx-gap-2 hx-capitalize">
{{- partial "utils/icon.html" (dict "name" "sun" "attributes" "height=12 class=\"group-data-[theme=light]:hx-hidden\"") -}}
{{- if not $hideLabel }}<span class="group-data-[theme=light]:hx-hidden">{{ $light }}</span>{{ end -}}
{{- partial "utils/icon.html" (dict "name" "moon" "attributes" "height=12 class=\"group-data-[theme=dark]:hx-hidden\"") -}}
{{- if not $hideLabel }}<span class="group-data-[theme=dark]:hx-hidden">{{ $dark }}</span>{{ end -}}
<div class="hx:flex hx:items-center hx:gap-2 hx:capitalize">
{{- partial "utils/icon.html" (dict "name" "sun" "attributes" "height=12 class=\"hx:group-data-[theme=light]:hidden\"") -}}
{{- if not $hideLabel }}<span class="hx:group-data-[theme=light]:hidden">{{ $light }}</span>{{ end -}}
{{- partial "utils/icon.html" (dict "name" "moon" "attributes" "height=12 class=\"hx:group-data-[theme=dark]:hidden\"") -}}
{{- if not $hideLabel }}<span class="hx:group-data-[theme=dark]:hidden">{{ $dark }}</span>{{ end -}}
</div>
</button>

22
layouts/partials/toc.html
View File

@ -5,11 +5,11 @@
{{- $editThisPage := (T "editThisPage") | default "Edit this page"}}
{{- $backToTop := (T "backToTop") | default "Scroll to top" -}}
<nav class="hextra-toc hx-order-last hx-hidden hx-w-64 hx-shrink-0 xl:hx-block print:hx-hidden hx-px-4" aria-label="table of contents">
<nav class="hextra-toc hx:order-last hx:hidden hx:w-64 hx:shrink-0 hx:xl:block hx:print:hidden hx:px-4" aria-label="table of contents">
{{- if $toc }}
<div class="hextra-scrollbar hx-sticky hx-top-16 hx-overflow-y-auto hx-pr-4 hx-pt-6 hx-text-sm [hyphens:auto] hx-max-h-[calc(100vh-var(--navbar-height)-env(safe-area-inset-bottom))] ltr:hx--mr-4 rtl:hx--ml-4">
<div class="hextra-scrollbar hx:sticky hx:top-16 hx:overflow-y-auto hx:pr-4 hx:pt-6 hx:text-sm [hyphens:auto] hx:max-h-[calc(100vh-var(--navbar-height)-env(safe-area-inset-bottom))] hx:ltr:-mr-4 hx:rtl:-ml-4">
{{- with .Fragments.Headings -}}
<p class="hx-mb-4 hx-font-semibold hx-tracking-tight">{{ $onThisPage }}</p>
<p class="hx:mb-4 hx:font-semibold hx:tracking-tight">{{ $onThisPage }}</p>
{{- range . -}}
<ul>
{{- with .Headings -}}{{ template "toc-subheading" (dict "headings" . "level" 0) }}{{- end -}}
@ -17,13 +17,13 @@
{{- end -}}
{{- end -}}
{{- $borderClass := "hx-mt-8 hx-border-t hx-bg-white hx-pt-8 hx-shadow-[0_-12px_16px_white] dark:hx-bg-dark dark:hx-shadow-[0_-12px_16px_#111]" -}}
{{- $borderClass := "hx:mt-8 hx:border-t hx:bg-white hx:pt-8 hx:shadow-[0_-12px_16px_white] hx:dark:bg-dark hx:dark:shadow-[0_-12px_16px_#111]" -}}
{{- if not .Fragments.Headings -}}
{{- $borderClass = "" -}}
{{- end -}}
{{/* TOC bottom part */}}
<div class="{{ $borderClass }} hx-sticky hx-bottom-0 hx-flex hx-flex-col hx-items-start hx-gap-2 hx-pb-8 dark:hx-border-neutral-800 contrast-more:hx-border-t contrast-more:hx-border-neutral-400 contrast-more:hx-shadow-none contrast-more:dark:hx-border-neutral-400">
<div class="{{ $borderClass }} hx:sticky hx:bottom-0 hx:flex hx:flex-col hx:items-start hx:gap-2 hx:pb-8 hx:border-gray-200 hx:dark:border-neutral-800 hx:contrast-more:border-t hx:contrast-more:border-neutral-400 hx:contrast-more:shadow-none hx:contrast-more:dark:border-neutral-400">
{{- if site.Params.editURL.enable -}}
{{- $editURL := site.Params.editURL.base | default "" -}}
{{- with .Params.editURL -}}
@ -38,14 +38,14 @@
{{- $editURL = urls.JoinPath $editURL $sourceDir $path -}}
{{- end -}}
{{- end -}}
<a class="hx-text-xs hx-font-medium hx-text-gray-500 hover:hx-text-gray-900 dark:hx-text-gray-400 dark:hover:hx-text-gray-100 contrast-more:hx-text-gray-800 contrast-more:dark:hx-text-gray-50" href="{{ $editURL }}" target="_blank" rel="noreferer">{{ $editThisPage }}</a>
<a class="hx:text-xs hx:font-medium hx:text-gray-500 hx:hover:text-gray-900 hx:dark:text-gray-400 hx:dark:hover:text-gray-100 hx:contrast-more:text-gray-800 hx:contrast-more:dark:text-gray-50" href="{{ $editURL }}" target="_blank" rel="noreferrer">{{ $editThisPage }}</a>
{{- end -}}
{{/* Scroll To Top */}}
<button aria-hidden="true" id="backToTop" onClick="scrollUp();" class="hx-transition-all hx-duration-75 hx-opacity-0 hx-text-xs hx-font-medium hx-text-gray-500 hover:hx-text-gray-900 dark:hx-text-gray-400 dark:hover:hx-text-gray-100 contrast-more:hx-text-gray-800 contrast-more:dark:hx-text-gray-50">
<button aria-hidden="true" id="backToTop" onClick="scrollUp();" class="hx:cursor-pointer hx:transition-all hx:duration-75 hx:opacity-0 hx:text-xs hx:font-medium hx:text-gray-500 hx:hover:text-gray-900 hx:dark:text-gray-400 hx:dark:hover:text-gray-100 hx:contrast-more:text-gray-800 hx:contrast-more:dark:text-gray-50">
<span>
{{- $backToTop -}}
</span>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="hx-inline ltr:hx-ml-1 rtl:hx-mr-1 hx-h-3.5 hx-w-3.5 hx-border hx-rounded-full hx-border-gray-500 hover:hx-border-gray-900 dark:hx-border-gray-400 dark:hover:hx-border-gray-100 contrast-more:hx-border-gray-800 contrast-more:dark:hx-border-gray-50">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="hx:inline hx:ltr:ml-1 hx:rtl:mr-1 hx:h-3.5 hx:w-3.5 hx:rounded-full hx:border hx:border-gray-500 hx:hover:border-gray-900 hx:dark:border-gray-400 hx:dark:hover:border-gray-100 hx:contrast-more:border-gray-800 hx:contrast-more:dark:border-gray-50">
<path stroke-linecap="round" stroke-linejoin="round" d="M4.5 15.75l7.5-7.5 7.5 7.5" />
</svg>
</button>
@ -63,12 +63,12 @@
{{- end -}}
{{- $padding := (mul $level 4) -}}
{{- $class := cond (eq $level 0) "hx-font-semibold" (printf "ltr:hx-pl-%d rtl:hx-pr-%d" $padding $padding) -}}
{{- $class := cond (eq $level 0) "hx:font-semibold" (printf "hx:ltr:pl-%d hx:rtl:pr-%d" $padding $padding) -}}
{{- range $headings }}
{{- if .Title }}
<li class="hx-my-2 hx-scroll-my-6 hx-scroll-py-6">
<a class="{{ $class }} hx-inline-block hx-text-gray-500 hover:hx-text-gray-900 dark:hx-text-gray-400 dark:hover:hx-text-gray-300 contrast-more:hx-text-gray-900 contrast-more:hx-underline contrast-more:dark:hx-text-gray-50 hx-w-full hx-break-words" href="#{{ anchorize .ID }}">
<li class="hx:my-2 hx:scroll-my-6 hx:scroll-py-6">
<a class="{{ $class }} hx:inline-block hx:text-gray-500 hx:hover:text-gray-900 hx:dark:text-gray-400 hx:dark:hover:text-gray-300 hx:contrast-more:text-gray-900 hx:contrast-more:underline hx:contrast-more:dark:text-gray-50 hx:w-full hx:break-words" href="#{{ anchorize .ID }}">
{{- .Title | safeHTML | plainify | htmlUnescape }}
</a>
</li>

6
layouts/partials/utils/page-width.html
View File

@ -14,14 +14,14 @@
{{- with $pageWidth -}}
{{ if eq . "wide" -}}
{{ $pageWidth = "hx-max-w-[90rem]" -}}
{{ $pageWidth = "hx:max-w-[90rem]" -}}
{{ else if eq . "full" -}}
{{ $pageWidth = "max-w-full" -}}
{{ else -}}
{{ $pageWidth = "hx-max-w-screen-xl" -}}
{{ $pageWidth = "hx:max-w-screen-xl" -}}
{{ end -}}
{{ else -}}
{{ $pageWidth = "hx-max-w-screen-xl" -}}
{{ $pageWidth = "hx:max-w-screen-xl" -}}
{{ end -}}
{{ return $pageWidth }}

36
layouts/shortcodes/badge.html Normal file
View File

@ -0,0 +1,36 @@
{{- if .IsNamedParams -}}
{{- $content := .Get "content" -}}
{{- $type := .Get "type" | default "" -}}
{{- $class := .Get "class" | default "" -}}
{{- $link := .Get "link" | default "" -}}
{{- $icon := .Get "icon" | default "" -}}
{{- if $link -}}
<a href="{{ $link }}" title="{{ $content | plainify }}" target="_blank">
{{- partial "shortcodes/badge.html" (dict
"content" $content
"type" $type
"class" $class
"border" true
"icon" $icon
)
-}}
</a>
{{- else -}}
{{- partial "shortcodes/badge.html" (dict
"content" $content
"type" $type
"class" $class
"border" true
"icon" $icon
)
-}}
{{- end -}}
{{- else -}}
{{- $content := .Get 0 -}}
{{- partial "shortcodes/badge.html" (dict
"content" $content
"border" true
)
-}}
{{- end -}}

46
layouts/shortcodes/callout.html
View File

@ -1,37 +1,19 @@
{{ $calloutEmojiDict := dict "info" "ℹ️" "warning" "⚠️" "error" "🚫" }}
{{ $type := .Get "type" | default "default" }}
{{- $calloutEmojiDict := dict "info" "ℹ️" "warning" "⚠️" "error" "🚫" -}}
{{- $type := .Get "type" | default "default" -}}
{{/* If emoji is not set, use the emoji from dict */}}
{{ $emoji := .Get "emoji" }}
{{ if eq $emoji "" }}
{{ $emoji = index $calloutEmojiDict $type }}
{{ end }}
{{- $emoji := .Get "emoji" -}}
{{- if eq $emoji "" -}}
{{- $emoji = index $calloutEmojiDict $type -}}
{{- end -}}
{{/* Also allow using "icon" */}}
{{ $icon := .Get "icon" }}
{{- $icon := .Get "icon" -}}
{{- $content := .InnerDeindent | markdownify -}}
{{ $defaultClass := "hx-border-orange-100 hx-bg-orange-50 hx-text-orange-800 dark:hx-border-orange-400/30 dark:hx-bg-orange-400/20 dark:hx-text-orange-300" }}
{{ $infoClass := "hx-border-blue-200 hx-bg-blue-100 hx-text-blue-900 dark:hx-border-blue-200/30 dark:hx-bg-blue-900/30 dark:hx-text-blue-200" }}
{{ $warningClass := "hx-border-yellow-100 hx-bg-yellow-50 hx-text-yellow-900 dark:hx-border-yellow-200/30 dark:hx-bg-yellow-700/30 dark:hx-text-yellow-200" }}
{{ $errorClass := "hx-border-red-200 hx-bg-red-100 hx-text-red-900 dark:hx-border-red-200/30 dark:hx-bg-red-900/30 dark:hx-text-red-200" }}
{{- $defaultClass := "hx:border-orange-100 hx:bg-orange-50 hx:text-orange-800 hx:dark:border-orange-400/30 hx:dark:bg-orange-400/20 hx:dark:text-orange-300" -}}
{{- $infoClass := "hx:border-blue-200 hx:bg-blue-100 hx:text-blue-900 hx:dark:border-blue-200/30 hx:dark:bg-blue-900/30 hx:dark:text-blue-200" -}}
{{- $warningClass := "hx:border-yellow-100 hx:bg-yellow-50 hx:text-yellow-900 hx:dark:border-yellow-200/30 hx:dark:bg-yellow-700/30 hx:dark:text-yellow-200" -}}
{{- $errorClass := "hx:border-red-200 hx:bg-red-100 hx:text-red-900 hx:dark:border-red-200/30 hx:dark:bg-red-900/30 hx:dark:text-red-200" -}}
{{ $class := cond (eq $type "info") $infoClass (cond (eq $type "warning") $warningClass (cond (eq $type "error") $errorClass $defaultClass)) }}
{{- $class := cond (eq $type "info") $infoClass (cond (eq $type "warning") $warningClass (cond (eq $type "error") $errorClass $defaultClass)) -}}
<div class="hx-overflow-x-auto hx-mt-6 hx-flex hx-rounded-lg hx-border hx-py-2 ltr:hx-pr-4 rtl:hx-pl-4 contrast-more:hx-border-current contrast-more:dark:hx-border-current {{ $class }}">
<div class="ltr:hx-pl-3 ltr:hx-pr-2 rtl:hx-pr-3 rtl:hx-pl-2">
{{- with $emoji -}}
<div class="hx-select-none hx-text-xl" style="font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';">
{{ . }}
</div>
{{- else -}}
{{- with $icon }}
{{ partial "utils/icon.html" (dict "name" . "attributes" `height=1.2em class="hx-inline-block hx-align-middle"`) -}}
{{- end -}}
{{- end -}}
</div>
<div class="hx-w-full hx-min-w-0 hx-leading-7">
<div class="hx-mt-6 hx-leading-7 first:hx-mt-0">
{{ .InnerDeindent | markdownify }}
</div>
</div>
</div>
{{- partial "shortcodes/callout.html" (dict "content" $content "emoji" $emoji "icon" $icon "class" $class) -}}

31
layouts/shortcodes/card.html
View File

@ -7,30 +7,25 @@
{{- $width := 0 -}}
{{- $height := 0 -}}
{{- $imageStyle := .Get "imageStyle" -}}
{{- $tag := .Get "tag" -}}
{{- $tagType := .Get "tagType" -}}
{{/* Image processing options */}}
{{- $method := .Get "method" | default "Resize" | humanize -}}
{{- $options := .Get "options" | default "800x webp q80" -}}
{{- $process := .Get "process" | default (printf "%s %s" $method $options) -}}
{{- if and $image (not (urls.Parse $image).Scheme) -}}
{{/* Process images in assets */}}
{{- with resources.Get $image -}}
{{- $processed := "" -}}
{{- if eq $method "Resize" -}}
{{- $processed = (.Resize $options) -}}
{{- else if eq $method "Fit" -}}
{{- $processed = (.Fit $options) -}}
{{- else if eq $method "Fill" -}}
{{- $processed = (.Fill $options) -}}
{{- else if eq $method "Crop" -}}
{{- $processed = (.Crop $options) -}}
{{- else -}}
{{- errorf "Invalid image processing command: Must be one of Crop, Fit, Fill or Resize." -}}
{{- with or (.Page.Resources.Get $image) (resources.Get $image) -}}
{{/* .Process does not work on svgs */}}
{{- if (not (eq .MediaType.SubType "svg")) -}}
{{/* Retrieve the $image resource from local or global resources */}}
{{- $processed := .Process $process -}}
{{- $width = $processed.Width -}}
{{- $height = $processed.Height -}}
{{- $image = $processed.RelPermalink -}}
{{- end -}}
{{- $width = $processed.Width -}}
{{- $height = $processed.Height -}}
{{- $image = $processed.RelPermalink -}}
{{- else -}}
{{ else }}
{{/* Otherwise, use relative link of the image */}}
{{- if hasPrefix $image "/" -}}
{{- $image = relURL (strings.TrimPrefix "/" $image) -}}
@ -48,5 +43,7 @@
"width" $width
"height" $height
"imageStyle" $imageStyle
"tag" $tag
"tagType" $tagType
)
-}}

4
layouts/shortcodes/cards.html
View File

@ -1,5 +1,3 @@
{{- $cols := .Get "cols" | default 3 -}}
<div class="hextra-cards hx-mt-4 hx-gap-4 hx-grid not-prose" style="--hextra-cards-grid-cols: {{ $cols }};">
{{- .Inner -}}
</div>
{{- partial "shortcodes/cards" (dict "cols" $cols "content" .Inner) -}}

8
layouts/shortcodes/details.html
View File

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

6
layouts/shortcodes/filetree/container.html
View File

@ -1,5 +1,5 @@
<div class="hextra-filetree hx-mt-6 hx-select-none hx-text-sm hx-text-gray-800 dark:hx-text-gray-300 not-prose">
<div class="hx-inline-block hx-rounded-lg hx-border hx-px-4 hx-py-2 dark:hx-border-neutral-800">
{{- .Inner -}}
<div class="hextra-filetree hx:mt-6 hx:select-none hx:text-sm hx:text-gray-800 hx:dark:text-gray-300 not-prose">
<div class="hx:inline-block hx:rounded-lg hx:px-4 hx:py-2 hx:border hx:border-gray-200 hx:dark:border-neutral-800">
{{- .InnerDeindent -}}
</div>
</div>

6
layouts/shortcodes/filetree/file.html
View File

@ -1,9 +1,9 @@
{{- $name := .Get "name" -}}
<li class="hx-flex hx-list-none">
<span class="hx-inline-flex hx-cursor-default hx-items-center hx-py-1">
<li class="hx:flex hx:list-none">
<span class="hx:inline-flex hx:cursor-default hx:items-center hx:py-1">
{{- partial "utils/icon" (dict "name" "document-text" "attributes" "width=1em") -}}
<span class="ltr:hx-ml-1 rtl:hx-mr-1">{{ $name | markdownify }}</span>
<span class="hx:ltr:ml-1 hx:rtl:mr-1">{{ $name | markdownify }}</span>
</span>
</li>

14
layouts/shortcodes/filetree/folder.html
View File

@ -1,17 +1,17 @@
{{- $name := .Get "name" -}}
{{- $state := .Get "state" | default "open" }}
<li class="hx-group hx-flex hx-list-none hx-flex-col">
<button class="hextra-filetree-folder hx-inline-flex hx-cursor-pointer hx-items-center hx-py-1 hover:hx-opacity-60">
<span data-state="{{ $state }}" class="data-[state=open]:hx-hidden">
<li class="hx:group hx:flex hx:list-none hx:flex-col">
<button class="hextra-filetree-folder hx:inline-flex hx:cursor-pointer hx:items-center hx:py-1 hx:hover:opacity-60">
<span data-state="{{ $state }}" class="hx:data-[state=open]:hidden">
{{- partial "utils/icon" (dict "name" "folder" "attributes" "width=1em") -}}
</span>
<span data-state="{{ $state }}" class="data-[state=closed]:hx-hidden">
<span data-state="{{ $state }}" class="hx:data-[state=closed]:hidden">
{{- partial "utils/icon" (dict "name" "folder-open" "attributes" "width=1em") -}}
</span>
<span class="ltr:hx-ml-1 rtl:hx-mr-1">{{ $name }}</span>
<span class="hx:ltr:ml-1 hx:rtl:mr-1">{{ $name }}</span>
</button>
<ul data-state="{{ $state }}" class="ltr:hx-pl-5 rtl:hx-pr-5 data-[state=closed]:hx-hidden">
{{- .Inner -}}
<ul data-state="{{ $state }}" class="hx:ltr:pl-5 hx:rtl:pr-5 hx:data-[state=closed]:hidden">
{{- .InnerDeindent -}}
</ul>
</li>

12
layouts/shortcodes/hextra/feature-card.html
View File

@ -17,20 +17,20 @@
<a
{{ with $link }}href="{{ $href }}" {{ with $external }} target="_blank" rel="noreferrer"{{ end }}{{ end }}
{{ with $style }}style="{{ . | safeCSS }}"{{ end }}
class="{{ $class }} hextra-feature-card not-prose hx-block hx-relative hx-overflow-hidden hx-rounded-3xl hx-border hx-border-gray-200 hover:hx-border-gray-300 dark:hx-border-neutral-800 dark:hover:hx-border-neutral-700 before:hx-pointer-events-none before:hx-absolute before:hx-inset-0 before:hx-bg-glass-gradient"
class="{{ $class }} hextra-feature-card not-prose hx:block hx:relative hx:overflow-hidden hx:rounded-3xl hx:border hx:border-gray-200 hx:hover:border-gray-300 hx:dark:border-neutral-800 hx:dark:hover:border-neutral-700 hx:before:pointer-events-none hx:before:absolute hx:before:inset-0 hx:before:bg-glass-gradient"
>
<div class="hx-relative hx-w-full hx-p-6">
<h3 class="hx-text-2xl hx-font-medium hx-leading-6 hx-mb-2 hx-flex hx-items-center">
<div class="hx:relative hx:w-full hx:p-6">
<h3 class="hx:text-2xl hx:font-medium hx:leading-6 hx:mb-2 hx:flex hx:items-center">
{{ with $icon -}}
<span class="hx-pr-2">
<span class="hx:pr-2">
{{- partial "utils/icon.html" (dict "name" . "attributes" "height=1.5rem") -}}
</span>
{{ end -}}
<span>{{ $title }}</span>
</h3>
<p class="hx-text-gray-500 dark:hx-text-gray-400 hx-text-sm hx-leading-6">{{ $subtitle | markdownify }}</p>
<p class="hx:text-gray-500 hx:dark:text-gray-400 hx:text-sm hx:leading-6">{{ $subtitle | markdownify }}</p>
</div>
{{- with $image -}}
<img src="{{ . }}" class="hx-absolute hx-max-w-none {{ $imageClass }}" alt="{{ $title }}" />
<img src="{{ . }}" class="hx:absolute hx:max-w-none {{ $imageClass }}" alt="{{ $title }}" />
{{- end -}}
</a>

2
layouts/shortcodes/hextra/feature-grid.html
View File

@ -5,7 +5,7 @@
<div
class="hextra-feature-grid hx-grid sm:max-lg:hx-grid-cols-2 max-sm:hx-grid-cols-1 hx-gap-4 hx-w-full not-prose"
class="hextra-feature-grid hx:grid hx:sm:max-lg:grid-cols-2 hx:max-sm:grid-cols-1 hx:gap-4 hx:w-full not-prose"
{{ with $css }}style="{{ . | safeCSS }}"{{ end }}
>
{{ .Inner }}

2
layouts/shortcodes/hextra/hero-badge.html
View File

@ -7,7 +7,7 @@
<a
{{ if $link }}href="{{ $href }}"{{ end }}
class="{{ $class }} not-prose hx-inline-flex hx-items-center hx-rounded-full hx-gap-2 hx-px-3 hx-py-1 hx-text-xs hx-text-gray-600 dark:hx-text-gray-400 hx-bg-gray-100 dark:hx-bg-neutral-800 dark:hx-border-neutral-800 hx-border hover:hx-border-gray-400 dark:hover:hx-text-gray-50 dark:hover:hx-border-gray-600 hx-transition-all hx-ease-in hx-duration-200"
class="{{ $class }} not-prose hx:inline-flex hx:items-center hx:rounded-full hx:gap-2 hx:px-3 hx:py-1 hx:text-xs hx:text-gray-600 hx:dark:text-gray-400 hx:bg-gray-100 hx:dark:bg-neutral-800 hx:border-gray-200 hx:dark:border-neutral-800 hx:border hx:hover:border-gray-400 hx:dark:hover:text-gray-50 hx:dark:hover:border-gray-600 hx:transition-all hx:ease-in hx:duration-200"
{{ with $style }}style="{{ . | safeCSS }}"{{ end }}
{{ if $external }}target="_blank" rel="noreferrer"{{ end -}}
>

2
layouts/shortcodes/hextra/hero-button.html
View File

@ -7,7 +7,7 @@
<a
href="{{ $href }}"
class="not-prose hx-font-medium hx-cursor-pointer hx-px-6 hx-py-3 hx-rounded-full hx-text-center hx-text-white hx-inline-block hx-bg-primary-600 hover:hx-bg-primary-700 focus:hx-outline-none focus:hx-ring-4 focus:hx-ring-primary-300 dark:hx-bg-primary-600 dark:hover:hx-bg-primary-700 dark:focus:hx-ring-primary-800 hx-transition-all hx-ease-in hx-duration-200"
class="not-prose hx:font-medium hx:cursor-pointer hx:px-6 hx:py-3 hx:rounded-full hx:text-center hx:text-white hx:inline-block hx:bg-primary-600 hx:hover:bg-primary-700 hx:focus:outline-hidden hx:focus:ring-4 hx:focus:ring-primary-300 hx:dark:bg-primary-600 hx:dark:hover:bg-primary-700 hx:dark:focus:ring-primary-800 hx:transition-all hx:ease-in hx:duration-200"
{{ with $style }}style="{{ . | safeCSS }}"{{ end }}
{{ if $external }}target="_blank" rel="noreferrer"{{ end -}}
>

8
layouts/shortcodes/hextra/hero-container.html
View File

@ -18,18 +18,18 @@
{{- end -}}
<div
class="{{ $class }} hextra-feature-grid hx-grid sm:max-lg:hx-grid-cols-2 max-sm:hx-grid-cols-1 hx-gap-4 hx-w-full not-prose"
class="{{ $class }} hextra-feature-grid hx:grid hx:sm:max-lg:grid-cols-2 hx:max-sm:grid-cols-1 hx:gap-4 hx:w-full not-prose"
{{ with $css }}style="{{ . | safeCSS }}"{{ end }}
>
<div class="hx-w-full">
<div class="hx:w-full">
{{ .Inner }}
</div>
{{- with $image }}
<div class="hx-mx-auto">
<div class="hx:mx-auto">
<a
{{ with $imageLink }}href="{{ $href }}" {{ with $imageLinkExternal }} target="_blank" rel="noreferrer"{{ end }}{{ end }}
{{ with $imageStyle }}style="{{ . | safeCSS }}"{{ end }}
class="{{ $imageClass }} {{ if $imageCard }}hextra-feature-card not-prose hx-block hx-relative hx-p-6 hx-overflow-hidden hx-rounded-3xl hx-border hx-border-gray-200 hover:hx-border-gray-300 dark:hx-border-neutral-800 dark:hover:hx-border-neutral-700 before:hx-pointer-events-none before:hx-absolute before:hx-inset-0 before:hx-bg-glass-gradient{{ end }}"
class="{{ $imageClass }} {{ if $imageCard }}hextra-feature-card not-prose hx:block hx:relative hx:p-6 hx:overflow-hidden hx:rounded-3xl hx:border hx:border-gray-200 hx:hover:border-gray-300 hx:dark:border-neutral-800 hx:dark:hover:border-neutral-700 hx:before:pointer-events-none hx:before:absolute hx:before:inset-0 hx:before:bg-glass-gradient{{ end }}"
>
<img src="{{ $image }}" width="{{ $imageWidth }}" height="{{ $imageHeight }}" {{ with $imageTitle }}alt="{{ $imageTitle }}"{{ end }}/>
</a>

2
layouts/shortcodes/hextra/hero-headline.html
View File

@ -2,7 +2,7 @@
<h1
class="not-prose hx-text-4xl hx-font-bold hx-leading-none hx-tracking-tighter md:hx-text-5xl hx-py-2 hx-bg-clip-text hx-text-transparent hx-bg-gradient-to-r hx-from-gray-900 hx-to-gray-600 dark:hx-from-gray-100 dark:hx-to-gray-400"
class="not-prose hx:text-4xl hx:font-bold hx:leading-none hx:tracking-tighter hx:md:text-5xl hx:py-2 hx:bg-clip-text hx:text-transparent hx:bg-gradient-to-r hx:from-gray-900 hx:to-gray-600 hx:dark:from-gray-100 hx:dark:to-gray-400"
{{ with $style }}style="{{ . | safeCSS }}"{{ end }}
>
{{ .Inner | markdownify }}

10
layouts/shortcodes/hextra/hero-section.html Normal file
View File

@ -0,0 +1,10 @@
{{- $style := .Get "style" -}}
{{- $heading := int (strings.TrimPrefix "h" (.Get "heading" | default "h2")) -}}
{{- $size := cond (ge $heading 4) "xl" (cond (eq $heading 3) "2xl" "4xl") -}}
<h{{ $heading }}
class="not-prose hx:text-{{ $size }} hx:font-bold hx:leading-none hx:tracking-tighter hx:md:text-3xl hx:py-2 hx:bg-clip-text hx:text-transparent hx:bg-gradient-to-r hx:from-gray-900 hx:to-gray-600 hx:dark:from-gray-100 hx:dark:to-gray-400"
{{ with $style }}style="{{ . | safeCSS }}"{{ end }}
>
{{ .Inner | markdownify }}
</h{{ $heading }}>

2
layouts/shortcodes/hextra/hero-subtitle.html
View File

@ -2,7 +2,7 @@
<p
class="not-prose hx-text-xl hx-text-gray-600 dark:hx-text-gray-400 sm:hx-text-xl"
class="not-prose hx:text-xl hx:text-gray-600 hx:dark:text-gray-400 hx:sm:text-xl"
{{ with $style }}style="{{ . | safeCSS }}"{{ end }}
>
{{ .Inner | markdownify }}

2
layouts/shortcodes/icon.html
View File

@ -8,6 +8,6 @@
{{- $icon = replaceRE "<svg" (printf "<svg %s" $attributes) $icon -}}
<span class="hx-inline-block hx-align-text-bottom icon">
<span class="hx:inline-block hx:align-text-bottom icon">
{{- $icon | safeHTML -}}
</span>

2
layouts/shortcodes/include.html
View File

@ -5,7 +5,7 @@ Renders the page using the RenderShortcode method on the Page object.
You must call this shortcode using the {{% %}} notation.
@param {string} (postional parameter 0) The path to the page, relative to the content directory.
@param {string} (positional parameter 0) The path to the page, relative to the content directory.
@returns template.HTML
@example {{% include "functions/_common/glob-patterns" %}}

81
layouts/shortcodes/jupyter.html Normal file
View File

@ -0,0 +1,81 @@
{{/* Render Jupyter Notebook */}}
{{- $path := .Get 0 -}}
{{- $data := "" -}}
{{- $page := .Page -}}
{{- $isLocal := not (urls.Parse $path).Scheme -}}
{{- $isPage := and (eq .Page.Kind "page") (not .Page.BundleType) -}}
{{/* https://gohugo.io/functions/transform/unmarshal/ */}}
{{- if (not $isLocal) -}}
{{- with resources.GetRemote $path -}}
{{- with unmarshal .Content -}}{{- $data = . -}}{{- end -}}
{{- else -}}
{{- errorf "Remote resource not found: %s" $path -}}
{{- end -}}
{{- else if (not $isPage) -}}
{{- with .Page.Resources.Get $path -}}
{{- with unmarshal .Content -}}{{- $data = . -}}{{- end -}}
{{- else -}}
{{- errorf "Local resource not found: %s" $path -}}
{{- end -}}
{{- else -}}
{{- with resources.Get $path -}}
{{- with unmarshal .Content -}}{{- $data = . -}}{{- end -}}
{{- else -}}
{{- errorf "Local resource not found: %s" $path -}}
{{- end -}}
{{- end -}}
{{- $language := index $data "metadata" "language_info" "name" | default "python" -}}
{{- with index $data "cells" -}}
{{- range $cell := . -}}
{{- if eq (index $cell "cell_type") "code" -}}
{{- $source := index $cell "source" -}}
{{- $sourceContent := (cond (reflect.IsSlice $source) (delimit $source "") $source) -}}
{{- with ($sourceContent | strings.Chomp) -}}
{{ (printf "\n\n```%s\n%s\n```\n" $language .) | safeHTML -}}
{{- end -}}
<div class="hextra-jupyter-code-cell hextra-scrollbar">
{{- $outputs := index $cell "outputs" -}}
{{- with $outputs -}}
<div class="hextra-jupyter-code-cell-outputs-container">
<div class="hextra-jupyter-code-cell-outputs">
{{- range $output := . -}}
{{- if eq (index $output "output_type") "display_data" -}}
{{- $data := index $output "data" -}}
{{- $image := index $data "image/png" -}}
{{- if $image -}}
<img src="data:image/png;base64,{{- $image -}}" alt="image" />
{{- end -}}
{{- else if eq (index $output "output_type") "stream" -}}
{{- $text := index $output "text" -}}
{{- $textContent := (cond (reflect.IsSlice $text) (delimit $text "") $text) -}}
<pre class="not-prose">{{- $textContent -}}</pre>
{{- else if eq (index $output "output_type") "execute_result" -}}
{{- $data := index $output "data" -}}
{{- $text := index $data "text/plain" -}}
{{- $textContent := (cond (reflect.IsSlice $text) (delimit $text "") $text) -}}
<pre class="not-prose">{{- $textContent -}}</pre>
{{- $html := index $data "text/html" -}}
{{- if $html -}}
{{- $htmlText := delimit $html "" -}}
<div>
{{- $htmlText | safeHTML -}}
</div>
{{- end -}}
{{- end -}}
{{- end -}}
</div>
</div>
{{- end -}}
</div>
{{- else if eq (index $cell "cell_type") "markdown" -}}
{{- $source := index $cell "source" }}
{{- $sourceContent := (cond (reflect.IsSlice $source) (delimit $source "") $source) }}
{{ (printf "\n%s\n" $sourceContent) | safeHTML }}
{{- end -}}
{{- end -}}
{{- end -}}

2
layouts/shortcodes/steps.html
View File

@ -1,3 +1,3 @@
<div class="steps hx-ml-4 hx-mb-12 ltr:hx-border-l rtl:hx-border-r hx-border-gray-200 ltr:hx-pl-6 rtl:hx-pr-6 dark:hx-border-neutral-800 [counter-reset:step]">
<div class="steps hx:ml-4 hx:mb-12 hx:ltr:border-l hx:rtl:border-r hx:border-gray-200 hx:ltr:pl-6 hx:rtl:pr-6 hx:dark:border-neutral-800 [counter-reset:step]">
{{- .Inner -}}
</div>

9
layouts/shortcodes/tab.html
View File

@ -1,11 +1,12 @@
{{- $defaultIndex := int ((.Parent.Get "defaultIndex") | default "0") -}}
<div
class="tabs-panel hx-rounded hx-pt-6 hx-hidden data-[state=selected]:hx-block"
class="hextra-tabs-panel hx:rounded-sm hx:pt-6 hx:hidden hx:data-[state=selected]:block"
id="tabs-panel-{{ .Ordinal }}"
role="tabpanel"
{{ if eq .Ordinal $defaultIndex }}tabindex="0"{{ end }}
{{ if eq .Ordinal $defaultIndex }}data-state="selected"{{ end }}
{{- if eq .Ordinal $defaultIndex }} tabindex="0" {{ end -}}
{{- if eq .Ordinal $defaultIndex }} data-state="selected" {{ end -}}
>
{{ .InnerDeindent | markdownify }}
{{- .InnerDeindent | markdownify -}}
</div>
{{- /* Drop trailing newlines */ -}}

34
layouts/shortcodes/tabs.html
View File

@ -5,22 +5,24 @@
{{ errorf "no items provided" }}
{{- end -}}
<div class="hx-mt-4 hx-flex hx-w-max hx-min-w-full hx-border-b hx-border-gray-200 hx-pb-px dark:hx-border-neutral-800">
{{- range $i, $item := $items -}}
<button
class="tabs-toggle data-[state=selected]:hx-border-primary-500 data-[state=selected]:hx-text-primary-600 hx-mr-2 hx-rounded-t hx-p-2 hx-font-medium hx-leading-5 hx-transition-colors -hx-mb-0.5 hx-select-none hx-border-b-2 hx-border-transparent hx-text-gray-600 hover:hx-border-gray-200 hover:hx-text-black dark:hx-text-gray-200 dark:hover:hx-border-neutral-800 dark:hover:hx-text-white"
role="tab"
type="button"
aria-controls="tabs-panel-{{ $i }}"
{{ if eq $i $defaultIndex }}aria-selected="true"{{ end }}
{{ if eq $i $defaultIndex }}tabindex="0"{{ end }}
{{ if eq $i $defaultIndex }}data-state="selected"{{ end }}
>
{{- $item -}}
</button>
{{- end -}}
<div class="hextra-scrollbar hx:overflow-x-auto hx:overflow-y-hidden hx:overscroll-x-contain">
<div class="hx:mt-4 hx:flex hx:w-max hx:min-w-full hx:border-b hx:border-gray-200 hx:pb-px hx:dark:border-neutral-800">
{{- range $i, $item := $items -}}
<button
class="hextra-tabs-toggle hx:cursor-pointer hx:data-[state=selected]:border-primary-500 hx:data-[state=selected]:text-primary-600 hx:data-[state=selected]:dark:border-primary-500 hx:data-[state=selected]:dark:text-primary-600 hx:mr-2 hx:rounded-t hx:p-2 hx:font-medium hx:leading-5 hx:transition-colors hx:-mb-0.5 hx:select-none hx:border-b-2 hx:border-transparent hx:text-gray-600 hx:hover:border-gray-200 hx:hover:text-black hx:dark:text-gray-200 hx:dark:hover:border-neutral-800 hx:dark:hover:text-white"
role="tab"
type="button"
aria-controls="tabs-panel-{{ $i }}"
{{- if eq $i $defaultIndex }} aria-selected="true" {{ end -}}
{{- if eq $i $defaultIndex }} tabindex="0" {{ end -}}
{{- if eq $i $defaultIndex }} data-state="selected"{{ end -}}
>
{{- $item -}}
</button>
{{- end -}}
</div>
</div>
<div>
{{ .Inner }}
{{- .Inner -}}
</div>
{{- /* Drop trailing newlines */ -}}