kushidou/hugo-theme-stack
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(gallery): rewrite gallery (#79)

Browse Source 
closes https://github.com/CaiJimmy/hugo-theme-stack/issues/70
This commit is contained in:
Jimmy Cai
2020-12-22 19:35:37 +01:00
committed by GitHub
parent 54571f036b
commit 31c42bcfe7
5 changed files with 109 additions and 301 deletions
Download Patch File Download Diff File Expand all files Collapse all files
layouts/_default/_markup/render-image.html
+1 -1
View File
@@ -7,7 +7,7 @@
{{- with $alt -}}
{{- $caption = . | safeHTML -}}
{{- end -}}
<figure>
<figure style="flex-grow: {{ div (mul $image.Width 100) $image.Height }}; flex-basis: {{ div (mul $image.Width 240) $image.Height }}px">
<a href="{{ $image.RelPermalink }}" data-size="{{ $image.Width }}x{{ $image.Height }}">
<img srcset="{{ $small.RelPermalink }} 480w, {{ $big.RelPermalink }} 1024w"
src="{{ $image.RelPermalink }}" width="{{ $image.Width }}" height="{{ $image.Height }}" loading="lazy"
layouts/partials/article/components/photoswipe.html
+8 -2
View File
@@ -1,5 +1,5 @@
<!-- Root element of PhotoSwipe. Must have class pswp. -->
<div class="pswp" tabindex="-1" role="dialog" aria-hidden="true" style="display:none">
<div class="pswp" tabindex="-1" role="dialog" aria-hidden="true">
<!-- Background of PhotoSwipe.
It's a separate element as animating opacity is faster than rgba(). -->
@@ -63,4 +63,10 @@
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/photoswipe@4.1.3/dist/photoswipe.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/photoswipe@4.1.3/dist/photoswipe-ui-default.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/photoswipe@4.1.3/dist/default-skin/default-skin.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/photoswipe@4.1.3/dist/photoswipe.css">