From 5bd4c40342ee88937d1503ffa914b2a622efa5d8 Mon Sep 17 00:00:00 2001
From: Justin Edmund <justin@jedmund.com>
Date: Mon, 16 Jun 2025 13:32:16 +0100
Subject: [PATCH] Fix masonry gap

---
 src/lib/components/MasonryPhotoGrid.svelte | 2 +-
 src/lib/components/PhotoItem.svelte        | 1 -
 2 files changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/lib/components/MasonryPhotoGrid.svelte b/src/lib/components/MasonryPhotoGrid.svelte
index 44f3278..a87b5b8 100644
--- a/src/lib/components/MasonryPhotoGrid.svelte
+++ b/src/lib/components/MasonryPhotoGrid.svelte
@@ -15,7 +15,7 @@
 	// These values work well with our existing design
 	let minColWidth = 200  // Minimum column width in px
 	let maxColWidth = 400  // Maximum column width in px
-	let gap = 24          // Gap between items (equivalent to $unit-3x)
+	let gap = 16          // Gap between items (equivalent to $unit-2x)
 
 	// On tablet/phone, we want larger minimum widths
 	let windowWidth = $state(0)
diff --git a/src/lib/components/PhotoItem.svelte b/src/lib/components/PhotoItem.svelte
index 8671d88..87b9624 100644
--- a/src/lib/components/PhotoItem.svelte
+++ b/src/lib/components/PhotoItem.svelte
@@ -88,7 +88,6 @@
 <style lang="scss">
 	.photo-item {
 		break-inside: avoid;
-		margin-bottom: $unit-3x;
 
 		@include breakpoint('tablet') {
 			margin-bottom: $unit-2x;