mxmehl/hugo-snap-gallery
1
0
Fork 0
Code Issues 2 Pull Requests Releases 2 Wiki Activity

make appearance of lightbox configurable

Browse Source
This commit is contained in:
Max Mehl
2024-02-05 14:04:31 +01:00
parent dc64b7bda1
commit 0a778ee8e9
6 changed files with 23 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
layouts/partials/gallery.html
View File

@@ -1,6 +1,6 @@
{{ $imgs := .imgs }}
{{ $galno := .galno }}
<div class="snap-gallery" style="--columns:{{ default 4 .columns }};--min-width:{{ default "200px" .minwidth }};--gap:10px;">
<div class="snap-gallery" style="--columns:{{ default 4 .columns }};--min-width:{{ default "200px" .minwidth }};--gap:10px;--cursor:{{ .cursor }};">
{{ range $i, $img := $imgs }}
<div class="snap-image">
<img src="{{ $img }}" onclick="openLightbox({{ $galno }});openLightboxItem({{ $galno }}, {{ add $i 1 }});">

2
layouts/partials/slideshow.html
View File

@@ -1,6 +1,6 @@
{{ $imgs := .imgs }}
{{ $galno := .galno }}
<div class="snap-slideshow" id="snap-slideshow-{{ $galno }}" style="--columns:1;--min-width:0px;--gap:0px;--slideshow-width:{{ default "100%" .width }}">
<div class="snap-slideshow" id="snap-slideshow-{{ $galno }}" style="--columns:1;--min-width:0px;--gap:0px;--slideshow-width:{{ default "100%" .width }};--cursor:{{ .cursor }};">
{{ range $i, $img := $imgs }}
<div class="snap-image">
<div class="numbertext">{{ add $i 1 }} / {{ len $imgs }}</div>

11
layouts/shortcodes/snap-gallery.html
View File

@@ -30,14 +30,19 @@
{{ end }}
{{ end }}
{{/* Define cursor when hovering over images, depending on lightbox status */}}
{{ $lightbox := (default true .Params.lightbox) }}
{{ $cursor := "auto" }}
{{ if $lightbox }}{{ $cursor = "zoom-in" }}{{ end }}
{{/* Visible images in separate modes */}}
{{ $mode := default "gallery" .Params.mode }}
{{/* Gallery mode */}}
{{ if eq $mode "gallery" }}
{{ partial "gallery" (dict "columns" .Params.columns "minwidth" .Params.minwidth "imgs" $imgs "galno" $galno) }}
{{ partial "gallery" (dict "columns" .Params.columns "minwidth" .Params.minwidth "imgs" $imgs "galno" $galno "cursor" $cursor) }}
{{/* Slideshow mode */}}
{{ else if eq $mode "slideshow" }}
{{ partial "slideshow" (dict "imgs" $imgs "galno" $galno "width" .Params.slideshowwidth) }}
{{ partial "slideshow" (dict "imgs" $imgs "galno" $galno "width" .Params.slideshowwidth "cursor" $cursor) }}
{{/* Set autorotate timer for slideshow, if configured (default: yes) */}}
{{ if .Params.slideshowrotate }}
<script>const autoSlideshow = setInterval(moveSlideshowItem, {{ default 5000 .Params.slideshowrotate_timer }}, {{ $galno }}, 1, "auto");</script>
@@ -45,4 +50,6 @@
{{ end }}
{{/* The Modal/Lightbox */}}
{{ if $lightbox }}
{{ partial "lightbox" (dict "galno" $galno "imgs" $imgs) }}
{{ end }}