From 2acfb84fc4944b6e5ed5ea4ba95fdfd20dc21893 Mon Sep 17 00:00:00 2001
From: Padreug <padreug@aiolabs.dev>
Date: Mon, 8 Jun 2026 17:40:29 +0200
Subject: [PATCH] feat(gallery): land-art gallery grid

Six-image square grid with serif captions on a card background.
Sources are Wix CDN URLs of works already in the existing gallery;
to be downloaded into public/ once selections are confirmed.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 src/i18n/locales/en.json  | 13 ++++++++
 src/i18n/locales/fr.json  | 13 ++++++++
 src/views/GalleryView.vue | 68 ++++++++++++++++++++++++++++++++++++---
 3 files changed, 90 insertions(+), 4 deletions(-)

diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json
index ed99030..6979683 100644
--- a/src/i18n/locales/en.json
+++ b/src/i18n/locales/en.json
@@ -68,6 +68,19 @@
       "body": "Community celebrations that braid art and ecology together — markets, live music, folk dance and seasonal exhibitions."
     }
   },
+  "gallery": {
+    "kicker": "Gallery",
+    "title": "Land art gallery",
+    "lede": "A turning archive of works grown from the land — sculpture, mosaic, found objects and small offerings made on site by residents and visitors.",
+    "captions": {
+      "landArt": "Sculpture in the garden",
+      "buddhaHand": "Gilded hand",
+      "fountain": "Stone garden fountain",
+      "mosaic": "Mosaic stones",
+      "petStatue": "Garden figure",
+      "miniBuddha": "Miniature shrine"
+    }
+  },
   "vision": {
     "hero": {
       "kicker": "Vision & Values",
diff --git a/src/i18n/locales/fr.json b/src/i18n/locales/fr.json
index 367f88d..1741819 100644
--- a/src/i18n/locales/fr.json
+++ b/src/i18n/locales/fr.json
@@ -68,6 +68,19 @@
       "body": "Des célébrations communautaires qui tissent art et écologie — marchés, musique vivante, danse folklorique et expositions saisonnières."
     }
   },
+  "gallery": {
+    "kicker": "Galerie",
+    "title": "Galerie d'art de la terre",
+    "lede": "Une archive vivante d'œuvres nées du lieu — sculpture, mosaïque, objets trouvés et petites offrandes faites sur place par les résident·es et les visiteur·euses.",
+    "captions": {
+      "landArt": "Sculpture dans le jardin",
+      "buddhaHand": "Main dorée",
+      "fountain": "Fontaine de pierre",
+      "mosaic": "Mosaïque de pierres",
+      "petStatue": "Figure de jardin",
+      "miniBuddha": "Petit autel"
+    }
+  },
   "vision": {
     "hero": {
       "kicker": "Vision & Valeurs",
diff --git a/src/views/GalleryView.vue b/src/views/GalleryView.vue
index 40f60b2..d82889f 100644
--- a/src/views/GalleryView.vue
+++ b/src/views/GalleryView.vue
@@ -2,11 +2,71 @@
 import { useI18n } from 'vue-i18n'
 
 const { t } = useI18n()
+
+const items = [
+  {
+    key: 'landArt' as const,
+    src: 'https://static.wixstatic.com/media/11062b_7c683da5bcbd44d7b0d2ddbaf4693625~mv2.jpg',
+  },
+  {
+    key: 'buddhaHand' as const,
+    src: 'https://static.wixstatic.com/media/11062b_2000d43a092c402ea7a62d1bf035158e~mv2.jpg',
+  },
+  {
+    key: 'fountain' as const,
+    src: 'https://static.wixstatic.com/media/a5b5ead2d4ee45aebc360586754a7ec2.jpg',
+  },
+  {
+    key: 'mosaic' as const,
+    src: 'https://static.wixstatic.com/media/3e0a4ede4ca84154973ffdce2ccf83b9.jpg',
+  },
+  {
+    key: 'petStatue' as const,
+    src: 'https://static.wixstatic.com/media/11062b_031106bf76154b3a93121564bfa4d7ac~mv2.jpg',
+  },
+  {
+    key: 'miniBuddha' as const,
+    src: 'https://static.wixstatic.com/media/11062b_ce4905ae109c49bb970fe4487a0325a3~mv2.jpg',
+  },
+]
 </script>
 
 <template>
-  <article class="mx-auto max-w-4xl px-4 py-16">
-    <h1 class="font-serif text-4xl font-semibold tracking-tight">{{ t('nav.gallery') }}</h1>
-    <p class="mt-4 text-muted-foreground">{{ t('common.comingSoon') }}</p>
-  </article>
+  <div>
+    <section class="border-b border-border bg-secondary/40">
+      <div class="mx-auto max-w-4xl px-4 py-16 lg:px-6 lg:py-20">
+        <p class="text-xs uppercase tracking-[0.2em] text-accent">{{ t('gallery.kicker') }}</p>
+        <h1 class="mt-3 font-serif text-5xl font-semibold leading-tight tracking-tight md:text-6xl">
+          {{ t('gallery.title') }}
+        </h1>
+        <p class="mt-6 max-w-prose text-lg leading-relaxed text-foreground/90">
+          {{ t('gallery.lede') }}
+        </p>
+      </div>
+    </section>
+
+    <section class="mx-auto max-w-7xl px-4 py-16 lg:px-6">
+      <ul class="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
+        <li
+          v-for="item in items"
+          :key="item.key"
+          class="group overflow-hidden rounded-lg border border-border bg-card"
+        >
+          <figure>
+            <img
+              :src="item.src"
+              :alt="t(`gallery.captions.${item.key}`)"
+              class="aspect-square w-full object-cover transition group-hover:scale-[1.02]"
+              loading="lazy"
+            />
+            <figcaption
+              class="border-t border-border px-4 py-3 font-serif text-sm text-foreground/85"
+            >
+              {{ t(`gallery.captions.${item.key}`) }}
+            </figcaption>
+          </figure>
+        </li>
+      </ul>
+    </section>
+  </div>
 </template>