mirror of
https://github.com/foo-dogsquared/hugo-theme-more-contentful.git
synced 2025-01-31 04:58:14 +00:00
e0277a50bb
It should be easier to integrate it with other libraries such as Prism, Mermaid, and D3 especially in the graphics department where it mostly use vector graphics to do its thing.
85 lines
3.1 KiB
HTML
85 lines
3.1 KiB
HTML
{{- /*
|
|
Here's where all of the inline partials are defined.
|
|
If the partial is short enough, it should be put here.
|
|
*/ -}}
|
|
|
|
{{- /* This is a partial that creates an icon from the icon templates. */ -}}
|
|
{{- define "partials/components/icon.html" }}
|
|
{{- $icon := . }}
|
|
{{- $res := resources.ExecuteAsTemplate (printf $icon.output $icon.id) $icon.id (resources.Get $icon.template) }}
|
|
<svg class="icon">
|
|
<use href="{{ $res.Permalink }}#{{ $icon.id }}"></use>
|
|
</svg>
|
|
{{- end }}
|
|
|
|
|
|
{{- /* A partial that aliases the Heroicon template from the icon partial */ -}}
|
|
{{- define "partials/components/heroicon.html" }}
|
|
{{- partial "components/icon.html" (dict "id" . "output" "icons/generic/%s.svg" "template" "templates/heroicon.svg") }}
|
|
{{ end }}
|
|
|
|
|
|
{{- define "partials/components/theme-button.html" }}
|
|
{{- if gt (len (index $.Site.Data "more-contentful").themes) 1 }}
|
|
<div class="site__theme-btn" aria-label="Theme toggle">
|
|
{{ partial "components/heroicon.html" "color-swatch" }}
|
|
<div class="site__theme-dropdown">
|
|
{{- range $filename, $scheme := (index $.Site.Data "more-contentful").themes }}
|
|
{{- $name := cond (eq $filename "_index") (printf "%s (default)" .scheme) .scheme }}
|
|
<div class="site__theme-item" {{ if ne $filename "_index" }}data-theme="{{ .scheme }}"{{ end }}>{{ $name }}</div>
|
|
{{- end }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script defer>
|
|
const themeDropdown = document.querySelector('.site__theme-btn');
|
|
themeDropdown.addEventListener('click', (event) => {
|
|
const { target } = event;
|
|
if (target.classList.contains("site__theme-item")) {
|
|
if (target.dataset.theme) {
|
|
theme = target.dataset.theme;
|
|
window.localStorage.setItem("theme", theme);
|
|
document.documentElement.dataset.theme = theme;
|
|
} else {
|
|
window.localStorage.removeItem("theme");
|
|
delete document.documentElement.dataset.theme;
|
|
}
|
|
}
|
|
});
|
|
</script>
|
|
{{- end }}
|
|
{{- end }}
|
|
|
|
|
|
{{- define "partials/components/post-meta.html" }}
|
|
<div class="list post__meta">
|
|
{{- if ne (.PublishDate.Format "2006") "0001" -}}
|
|
<time datetime="{{ .PublishDate }}">
|
|
{{ partial "components/heroicon.html" "calendar" }}
|
|
<span style="margin-left: 0.5em;">{{ .PublishDate.Format "2006-01-02" }}</span>
|
|
</time>
|
|
{{- end }}
|
|
|
|
{{- if and .GitInfo (ne (.PublishDate.Format "2006-01-02") (.Lastmod.Format "2006-01-02")) }}
|
|
<time datetime="{{ .Lastmod }}">
|
|
{{ partial "components/heroicon.html" "refresh" }}
|
|
<span style="margin-left: 0.5em;">{{ .Lastmod.Format "2006-01-02" }}</span>
|
|
</time>
|
|
{{- end }}
|
|
|
|
{{- /* The authors are appended with 'et al' if there's more than one author in the map. */ -}}
|
|
{{ with .Params.author }}
|
|
{{- $names := slice }}
|
|
{{- range . }}{{ $names = $names | append .name }}{{ end }}
|
|
{{- $author := index (first 1 $names) 0 }}
|
|
<span data-authors="{{ jsonify $names }}">
|
|
{{ partial "components/heroicon.html" "pencil" }}
|
|
<span style="margin-left: 0.5em;">
|
|
{{ $author }}{{ if ge (len .) 2 }}, et al.{{ end }}
|
|
</span>
|
|
</span>
|
|
{{ end }}
|
|
|
|
</div>
|
|
{{- end }}
|