From a3bbbcb0dbddd95891d69dba8f6e47f4fcc4bc21 Mon Sep 17 00:00:00 2001
From: Helen Chong <119173961+helenclx@users.noreply.github.com>
Date: Tue, 16 Apr 2024 19:28:45 +0800
Subject: [PATCH] Add website layout page

---
 src/_includes/macros.njk        |  6 ++++
 src/changelog/pages/layouts.njk | 55 +++++++++++++++++++++++++++++++++
 2 files changed, 61 insertions(+)
 create mode 100644 src/_includes/macros.njk
 create mode 100644 src/changelog/pages/layouts.njk

diff --git a/src/_includes/macros.njk b/src/_includes/macros.njk
new file mode 100644
index 00000000..02d6bbd4
--- /dev/null
+++ b/src/_includes/macros.njk
@@ -0,0 +1,6 @@
+{%- macro siteLayoutArchive(params) -%}
+    <h2>{{ params.title }}</h2>
+    {% for screenshot in params.screenshots %}
+        <img src="/assets/layouts/{{ screenshot.imgFile }}" alt="{{ screenshot.imgAlt }}">
+    {% endfor %}
+{%- endmacro -%}
\ No newline at end of file
diff --git a/src/changelog/pages/layouts.njk b/src/changelog/pages/layouts.njk
new file mode 100644
index 00000000..b1aed25a
--- /dev/null
+++ b/src/changelog/pages/layouts.njk
@@ -0,0 +1,55 @@
+---
+layout: main/changelog
+title: Website Layout Archive
+desc: An archive for the page layout designs mt website has used.
+changelogNav: Website Layouts
+metadata:
+    type: article
+date: 2022-01-01
+---
+
+{%- from "macros.njk" import siteLayoutArchive -%}
+
+{{ siteLayoutArchive({
+    title: "11 September 2023 Blog Layout",
+    screenshots: [
+        {
+            imgFile: "Leilukins-Hub-blog-layout-2023-09.png",
+            imgAlt: "Leilukin's Hub blog on 11 September 2023"
+        }
+    ]
+}) }}
+
+{{ siteLayoutArchive({
+    title: "23 June 2023",
+    screenshots: [
+        {
+            imgFile: "Leilukins-Hub-layout-2023-06.png",
+            imgAlt: "Leilukin's Hub home page on 23 June 2023"
+        }
+    ]
+}) }}
+
+{{ siteLayoutArchive({
+    title: "26 January 2023",
+    screenshots: [
+        {
+            imgFile: "Leilukins-Hub-layout-2023-01.png",
+            imgAlt: "Leilukin's Hub home page on 26 January 2023"
+        }
+    ]
+}) }}
+
+{{ siteLayoutArchive({
+    title: "11 September 2022 (Site Launch)",
+    screenshots: [
+        {
+            imgFile: "Leilukins-Hub-layout-2022-index.png",
+            imgAlt: "Leilukin's Hub index page during the site's launch on 11 September 2022"
+        },
+        {
+            imgFile: "Leilukins-Hub-layout-2022-page.png",
+            imgAlt: "Leilukin's Hub My Creation page during the site's launch on 11 September 2022"
+        }
+    ]
+}) }}