Rumperuu/Omphaloskepsis-2
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

feat: video galleries

Browse source
This commit is contained in:
Ben Goldsworthy 2025-05-05 21:27:09 +02:00
parent 5a1e4fc252
commit ff9c90f68b
No known key found for this signature in database
2 changed files with 44 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

14
assets/css/components/_gallery.scss
View file

@ -9,4 +9,18 @@
grid-column-end: -1;
grid-column-start: 1;
}
& .figure {
margin-trim: unset;
@supports not (margin-trim: block) {
&:first-child {
margin-block-start: 16px;
}
&:last-child {
margin-block-end: unset;
}
}
}
}

49
layouts/shortcodes/gallery.html
View file

@ -10,32 +10,43 @@
{{- with (.Get "dir") -}}
<!-- If a directory was specified, generate figures for all of the images in the directory -->
{{- $images := $.Page.Resources.Match ( print . "/*" ) }}
{{- range $images -}}
{{- $resources := $.Page.Resources.Match ( print . "/*" ) }}
{{- range $resources -}}
{{- $caption := .Name | replaceRE "\\..*" "" | humanize }}<!-- humanized filename without extension -->
{{- $linkURL := print $.Page.Permalink ($.Get "dir") "/" .Name | absURL }}<!-- absolute URL to hi-res image -->
<figure class="figure gallery__figure" itemprop="associatedMedia" itemscope itemtype="http://schema.org/ImageObject">
<a href="{{ .RelPermalink }}" itemprop="contentUrl">
<picture class="figure__picture"
{{- if eq .ResourceType "image" -}}
<picture class="figure__picture"
itemprop="image">
<img itemprop="thumbnail"
class="u-photo gallery__thumbnail"
{{ if ( or ( eq .MediaType.SubType "svg" ) ( eq .MediaType.SubType "gif" ) ) }}
src="{{ .RelPermalink }}"
{{ else }}
{{ with .Resize "600x webp" }}
<img itemprop="thumbnail"
class="u-photo gallery__thumbnail"
{{ if ( or ( eq .MediaType.SubType "svg" ) ( eq .MediaType.SubType "gif" ) ) }}
src="{{ .RelPermalink }}"
{{ else }}
{{ with .Resize "600x webp" }}
src="{{ .RelPermalink }}"
{{ end }}
width="{{ .Width }}"
height="{{ .Height }}"
{{ end }}
width="{{ .Width }}"
height="{{ .Height }}"
{{ end }}
{{- with .Params.alt }}
alt="{{ . }}"
{{- end -}}
{{- with .Params.title }} title="{{ . }}" {{ end -}}
loading="lazy"
>
</picture>
{{- with .Params.alt }}
alt="{{ . }}"
{{- end -}}
{{- with .Params.title }} title="{{ . }}" {{ end -}}
loading="lazy"
>
</picture>
{{- else if eq .ResourceType "video" -}}
{{- if eq .MediaType "video/ogg" -}}
{{- partial "media/audio.html" . -}}
{{- else -}}
{{- partial "media/video.html" ( dict "src" . "page_file_path" $.Page.File.Path ) -}}
{{- end -}}
{{- else if ( or ( ne .ResourceType "image" ) ( ne .ResourceType "video" ) ) -}}
{{- errorf "No handling for resource of type %q" .ResourceType -}}
{{- end -}}
</a>
{{- if or ( .Params.title ) ( .Params.attr ) -}}
<figcaption class="figure__caption{{ if not .Params.title }} figure__caption--no-height{{ end }}">