diff --git a/themes/red/assets/css/site.css b/themes/red/assets/css/site.css index a7ec0c9..59ceeef 100644 --- a/themes/red/assets/css/site.css +++ b/themes/red/assets/css/site.css @@ -34,7 +34,7 @@ } .grid-sizer, .grid-item { - width: 400px; + width: 49%; } .page-pic { @@ -43,6 +43,14 @@ } } +.gutter-sizer { + width: 1%; +} + +.grid-sizer, .grid-item { + margin-bottom: 1%; +} + /* mobile devices */ @media (max-width: 768px) { aside div { diff --git a/themes/red/assets/js/gallery.js b/themes/red/assets/js/gallery.js index 8757b26..7eb81e9 100644 --- a/themes/red/assets/js/gallery.js +++ b/themes/red/assets/js/gallery.js @@ -2,7 +2,7 @@ imagesLoaded(document.querySelector('.grid'), function(instance) { new Masonry('.grid', { itemSelector: '.grid-item', columnWidth: '.grid-sizer', - fitWidth: true, - gutter: 10, + percentPosition: true, + gutter: '.gutter-sizer' }); }); diff --git a/themes/red/layouts/_default/art-detail.html b/themes/red/layouts/_default/art-detail.html index 2cbcf02..0e4d51b 100644 --- a/themes/red/layouts/_default/art-detail.html +++ b/themes/red/layouts/_default/art-detail.html @@ -68,7 +68,7 @@
Thumbnail not found!
{{ end }}