Aroy/Rinkusu
1
1
Fork 0
mirror of https://github.com/Aroy-Art/Rinkusu.git synced 2024-12-27 07:44:23 +01:00
Code Issues 6 Projects Releases Packages Wiki Activity

Fix masonry so it works if there are multiple grids on the same page

Browse source
This commit is contained in:
Aroy-Art 2024-02-12 20:40:21 +01:00
parent 3de9992298
commit 1ce8d3af37
Signed by: Aroy
GPG key ID: 583642324A1D2070
3 changed files with 14 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
assets/js/script.js
View file

@ -15,18 +15,20 @@ observer.observe();
/* ========================================================================= */ /* ========================================================================= */
/* init Masonry for blog list /* init Masonry for blog list
/* ========================================================================= */ /* ========================================================================= */
var grid = document.querySelector('.blog-post'); var grids = document.querySelectorAll('.masonry-grid');
if (grid) { grids.forEach(function(grid) {
var msnry = new Masonry(grid, { if (grid) {
percentPosition: true var msnry = new Masonry(grid, {
}); percentPosition: true
});
imagesLoaded(grid).on('progress', function() { imagesLoaded(grid).on('progress', function() {
// layout Masonry after each image loads // layout Masonry after each image loads
msnry.layout(); msnry.layout();
}); });
} }
});
/* ========================================================================= */ /* ========================================================================= */
/* Image Preloader /* Image Preloader

2
layouts/_default/list.html
View file

@ -21,7 +21,7 @@
{{ partial "tagcloud.html" . }} {{ partial "tagcloud.html" . }}
<div class="row blog-post" data-masonry='{ "percentPosition": true }'> <div class="row masonry-grid" data-masonry='{ "percentPosition": true }'>
{{ $paginator := .Paginate .Data.Pages}} {{ $paginator := .Paginate .Data.Pages}}
{{ range $paginator.Pages }} {{ range $paginator.Pages }}
{{ .Render "article" }} {{ .Render "article" }}

2
layouts/static/portfolio.html
View file

@ -43,7 +43,7 @@
{{"<!-- /Section Title -->" | safeHTML}} {{"<!-- /Section Title -->" | safeHTML}}
</div> </div>
<div class="row portfolio-category" data-masonry='{ "percentPosition": true }'> <div class="row portfolio-category masonry-grid" data-masonry='{ "percentPosition": true }'>
{{ $category := .name }} {{ $category := .name }}
{{ range .portfolio_items }} {{ range .portfolio_items }}
{{- $original := resources.Get .image -}} {{- $original := resources.Get .image -}}