136 lines
4.4 KiB
HTML
136 lines
4.4 KiB
HTML
{{ define "main" }}
|
|
<header class="header">
|
|
<h3 class="terms__title h3">{{ .Title }}</h3>
|
|
<div class="gallery__contents">
|
|
{{ .Content }}
|
|
</div>
|
|
</header>
|
|
|
|
{{ if in (lower .Params.Mode) "one" }}
|
|
|
|
<main class="gallery main">
|
|
<div class="grid single__contents single__contents--gallery">
|
|
<div class="grid-sizer"></div>
|
|
{{ if .File.Dir }}
|
|
{{ $basename := (replace .File.Dir "\\" "/") }}
|
|
{{ range .Params.Images }}
|
|
<div class="grid-item">
|
|
<a data-alt="{{ print .caption }}" data-fancybox="gallery" href="{{ $basename | relURL }}{{ .image }}"><img src="{{ $basename | relURL }}{{ .image }}" alt="{{ print .caption }}"/></a>
|
|
<div class="grid-item__desc hide">{{ .caption }}</div>
|
|
</div>
|
|
{{ end }}
|
|
{{ end }}
|
|
</div>
|
|
{{ partial "pagination/pagination-single" . }}
|
|
</main>
|
|
|
|
{{ else }}
|
|
|
|
<main class="gallery main">
|
|
<div class="grid single__contents single__contents--gallery">
|
|
<div class="grid-sizer"></div>
|
|
{{ if .File.Dir }}
|
|
{{ $basename := (replace .File.Dir "\\" "/") }}
|
|
{{ range (readDir (print "./static/" $basename)) }}
|
|
<div class="grid-item">
|
|
<a data-alt="{{ index (split .Name ".") 0 }}" data-fancybox="gallery" href="{{ $basename | relURL }}{{ .Name }}"><img src="{{ $basename | relURL }}{{ .Name }}" alt="{{ index (split .Name ".") 0 }}"/></a>
|
|
<div class="grid-item__desc hide">{{ index (split .Name ".") 0 }}</div>
|
|
</div>
|
|
{{ end }}
|
|
{{ end }}
|
|
</div>
|
|
{{ partial "pagination/pagination-single" . }}
|
|
</main>
|
|
|
|
{{ end }}
|
|
|
|
<div class="hide">
|
|
{{ partial "sidebar/site-search" . }}
|
|
</div>
|
|
{{ partial "body/fancybox" . }}
|
|
|
|
{{ $masonry := resources.Get `js/masonry.pkgd.min.js` | resources.Fingerprint }}
|
|
<script defer src="{{ $masonry.RelPermalink }}"></script>
|
|
{{ $imagesloaded := resources.Get `js/imagesloaded.pkgd.min.js` | resources.Fingerprint }}
|
|
<script defer src="{{ $imagesloaded.RelPermalink }}"></script>
|
|
|
|
<script>
|
|
$(document).ready(function () {
|
|
var $grid = $('.grid').masonry({
|
|
itemSelector: '.grid-item',
|
|
columnWidth: '.grid-sizer',
|
|
percentPosition: true,
|
|
});
|
|
$grid.imagesLoaded().progress(function () {
|
|
$grid.masonry();
|
|
});
|
|
|
|
$('.grid-item').mouseenter(function () {
|
|
$(this).children('.grid-item__desc').show();
|
|
});
|
|
|
|
$('.grid-item').mouseleave(function () {
|
|
$(this).children('.grid-item__desc').hide();
|
|
});
|
|
|
|
$('.grid-item').click(function() {
|
|
$(this).children('a').get(0).click();
|
|
});
|
|
|
|
enquire.register("screen and (max-width:500px)", {
|
|
match: function () {
|
|
$('.grid-item').addClass('full');
|
|
$('.grid-sizer').addClass('full');
|
|
$('.grid-item').removeClass('half');
|
|
$('.grid-sizer').removeClass('half');
|
|
},
|
|
unmatch: function () {
|
|
$('.grid-item').addClass('half');
|
|
$('.grid-sizer').addClass('half');
|
|
$('.grid-item').removeClass('full');
|
|
$('.grid-sizer').removeClass('full');
|
|
},
|
|
}).register("screen and (max-width:700px)", {
|
|
match: function () {
|
|
$('.grid-item').addClass('half');
|
|
$('.grid-sizer').addClass('half');
|
|
$('.grid-item').removeClass('third');
|
|
$('.grid-sizer').removeClass('third');
|
|
},
|
|
unmatch: function () {
|
|
$('.grid-item').addClass('third');
|
|
$('.grid-sizer').addClass('third');
|
|
$('.grid-item').removeClass('half');
|
|
$('.grid-sizer').removeClass('half');
|
|
},
|
|
}).register("screen and (max-width:900px)", {
|
|
match: function () {
|
|
$('.grid-item').addClass('third');
|
|
$('.grid-sizer').addClass('third');
|
|
$('.grid-item').removeClass('quarter');
|
|
$('.grid-sizer').removeClass('quarter');
|
|
},
|
|
unmatch: function () {
|
|
$('.grid-item').addClass('quarter');
|
|
$('.grid-sizer').addClass('quarter');
|
|
$('.grid-item').removeClass('third');
|
|
$('.grid-sizer').removeClass('third');
|
|
},
|
|
}).register("screen and (max-width:1200px)", {
|
|
match: function () {
|
|
$('.grid-item').addClass('quarter');
|
|
$('.grid-sizer').addClass('quarter');
|
|
$('.grid-item').removeClass('fifth');
|
|
$('.grid-sizer').removeClass('fifth');
|
|
},
|
|
unmatch: function () {
|
|
$('.grid-item').addClass('fifth');
|
|
$('.grid-sizer').addClass('fifth');
|
|
$('.grid-item').removeClass('quarter');
|
|
$('.grid-sizer').removeClass('quarter');
|
|
},
|
|
});
|
|
});
|
|
</script>
|
|
|
|
{{ end }} |