From da6750194aea30f631651358d532f633a262701d Mon Sep 17 00:00:00 2001
From: Ina Elise <113548269+Inaelise@users.noreply.github.com>
Date: Fri, 5 Apr 2024 23:19:37 +0200
Subject: [PATCH] Adds html and css to section 2 gallery page (#306)

---
 pages/gallery-page.html | 110 +++++++++++++++++++++++++++++++++++++++-
 1 file changed, 109 insertions(+), 1 deletion(-)

diff --git a/pages/gallery-page.html b/pages/gallery-page.html
index 56b16964..382a0f36 100644
--- a/pages/gallery-page.html
+++ b/pages/gallery-page.html
@@ -172,7 +172,6 @@ <h2 id="search-label" class="sr-only">Search Bar</h2>
         <!-- JS intention: On click, add -translate-y-full to section id="search-drawer-from-header" and remove translate-y-0 -->
       </div>
     </section>
-
     <main>
       <!-- Section one starts here -->
       <section>
@@ -229,6 +228,115 @@ <h1 class="text-center text-[150px] font-justAnotherHand">Gallery</h1>
         </p>
       </section>
       <!-- Section one ends here -->
+      
+      <!-- Section two starts here -->
+      <section class="w-[1400px] m-auto py-10 px-6">
+        <div class="flex justify-center gap-28 py-10">
+          <div class="text-center font-inter text-xl">
+            <img
+              class="h-[350px]"
+              src="../assets/placeholder-images/IMG_5348.webp"
+              alt=""
+            />
+            <p class="pt-2">Lorem ipsum dolor sit amet</p>
+          </div>
+          <div class="text-center font-inter text-xl">
+            <img
+              class="h-[350px]"
+              src="../assets/placeholder-images/IMG_7424.webp"
+              alt=""
+            />
+            <p class="pt-2">Lorem ipsum dolor sit amet</p>
+          </div>
+          <div class="text-center font-inter text-xl">
+            <img
+              class="h-[350px]"
+              src="../assets/placeholder-images/IMG_3605.webp"
+              alt=""
+            />
+            <p class="pt-2">Lorem ipsum dolor sit amet</p>
+          </div>
+        </div>
+        <div class="flex justify-center gap-28 pb-10">
+          <div class="text-center font-inter text-xl">
+            <img
+              class="h-[350px]"
+              src="../assets/placeholder-images/IMG_3205.webp"
+              alt=""
+            />
+            <p class="pt-2">Lorem ipsum dolor sit amet</p>
+          </div>
+          <div class="text-center font-inter text-xl">
+            <img
+              class="h-[350px]"
+              src="../assets/placeholder-images/IMG_4202.webp"
+              alt=""
+            />
+            <p class="pt-2">Lorem ipsum dolor sit amet</p>
+          </div>
+          <div class="text-center font-inter text-xl">
+            <img
+              class="h-[350px]"
+              src="../assets/placeholder-images/IMG_1457.webp"
+              alt=""
+            />
+            <p class="pt-2">Lorem ipsum dolor sit amet</p>
+          </div>
+        </div>
+        <div class="flex justify-center gap-28 pb-10">
+          <div class="text-center font-inter text-xl">
+            <img
+              class="h-[350px]"
+              src="../assets/placeholder-images/IMG_6391.webp"
+              alt=""
+            />
+            <p class="pt-2">Lorem ipsum dolor sit amet</p>
+          </div>
+          <div class="text-center font-inter text-xl">
+            <img
+              class="h-[350px]"
+              src="../assets/placeholder-images/IMG_7542.webp"
+              alt=""
+            />
+            <p class="pt-2">Lorem ipsum dolor sit amet</p>
+          </div>
+          <div class="text-center font-inter text-xl">
+            <img
+              class="h-[350px]"
+              src="../assets/placeholder-images/IMG_7544.webp"
+              alt=""
+            />
+            <p class="pt-2">Lorem ipsum dolor sit amet</p>
+          </div>
+        </div>
+        <div class="flex justify-center gap-28 pb-10">
+          <div class="text-center font-inter text-xl">
+            <img
+              class="h-[350px]"
+              src="../assets/placeholder-images/IMG_3637.webp"
+              alt=""
+            />
+            <p class="pt-2">Lorem ipsum dolor sit amet</p>
+          </div>
+          <div class="text-center font-inter text-xl">
+            <img
+              class="h-[350px]"
+              src="../assets/placeholder-images/IMG_3634.webp"
+              alt=""
+            />
+            <p class="pt-2">Lorem ipsum dolor sit amet</p>
+          </div>
+          <div class="text-center font-inter text-xl">
+            <img
+              class="h-[350px]"
+              src="../assets/placeholder-images/IMG_7511.webp"
+              alt=""
+            />
+            <p class="pt-2">Lorem ipsum dolor sit amet</p>
+          </div>
+        </div>
+      </section>
+      <!-- Section two ends here -->
     </main>
   </body>
 </html>