mirror of
https://github.com/foo-dogsquared/hugo-theme-more-contentful.git
synced 2025-01-31 04:58:14 +00:00
108 lines
3.9 KiB
HTML
108 lines
3.9 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 and links them from the created file.
|
|
Why not embed the text into the resulting document, you ask?
|
|
I just want to save a few kilobytes of the total site weight. :)
|
|
|
|
It accepts a dictionary with the specified keys:
|
|
|
|
- id - The name of the resource in a specific set.
|
|
- output - The output location of the resource relative to the base URL.
|
|
It can accept a formatted string (e.g., "icons/brand/%s.svg") where 'id' will be used.
|
|
- template - The template file to be used.
|
|
It should be relative to the asset directory.
|
|
*/ -}}
|
|
{{- 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.
|
|
It only needs a string of the ID from one of the icons.
|
|
*/ -}}
|
|
{{- define "partials/components/heroicon.html" }}
|
|
{{- partial "components/icon.html" (dict "id" . "output" "icons/generic/%s.svg" "template" "templates/heroicon.svg") }}
|
|
{{ end }}
|
|
|
|
|
|
{{- /*
|
|
The theme button in its own bed.
|
|
Take note this component already has conditional rendering so a conditional is unnecessary.
|
|
*/ -}}
|
|
{{- 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 }}
|
|
|
|
|
|
{{- /*
|
|
The component where it will display the metadata of the post.
|
|
This is used on list templates but feel free to change that.
|
|
*/ -}}
|
|
{{- 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 }}
|