From 18db74998d901d9da5c238f6ebd520e653e505bd Mon Sep 17 00:00:00 2001
From: isUnknown <adrien.payet@outlook.com>
Date: Fri, 21 Feb 2025 12:43:48 +0100
Subject: [PATCH] fix grid column spacing mobile

---
 assets/css/src/footer.css | 10 +++++-----
 assets/css/src/grid.css   |  6 ++++++
 assets/js/script.js       | 12 +++++++-----
 3 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/assets/css/src/footer.css b/assets/css/src/footer.css
index 11a7e84..5c92f4d 100644
--- a/assets/css/src/footer.css
+++ b/assets/css/src/footer.css
@@ -20,8 +20,12 @@
   transform: translateY(-1px);
 }
 
+[data-template="home"] .title-wrapper button.open-nav {
+  display: inline-block !important;
+}
+
 @media screen and (max-width: 640px) {
-  .open-nav {
+  #main-footer .open-nav {
     box-sizing: border-box;
     bottom: 0;
     display: flex;
@@ -60,10 +64,6 @@
     display: none !important;
   }
 
-  [data-template="home"] button.open-nav {
-    display: inline-block !important;
-  }
-
   .open-nav-wrapper {
     padding: 0;
     border: none;
diff --git a/assets/css/src/grid.css b/assets/css/src/grid.css
index 8259c17..28594cf 100644
--- a/assets/css/src/grid.css
+++ b/assets/css/src/grid.css
@@ -25,6 +25,12 @@ body.full-width #main-content {
   margin-left: inherit;
 }
 
+@media screen and (max-width: 640px) {
+  .grid .column:not(:last-child) {
+    margin-bottom: calc(2 * var(--unit--vertical));
+  }
+}
+
 @media screen and (min-width: 640px) {
   [data-template="grid"] main #main-content {
     margin-left: calc(0px - calc(4 * var(--unit--horizontal)));
diff --git a/assets/js/script.js b/assets/js/script.js
index b1f5f7a..f734272 100644
--- a/assets/js/script.js
+++ b/assets/js/script.js
@@ -127,7 +127,7 @@ function subscribe(event) {
 
 const panelNav = document.querySelector(".panel");
 const navOverlay = document.querySelector("#nav-overlay");
-const openNavBtn = document.querySelector("button.open-nav");
+const openNavBtns = document.querySelectorAll("button.open-nav");
 const closeNavBtn = document.querySelector(".panel-close");
 function closeNav() {
   panelNav.classList.remove("panel--visible");
@@ -193,10 +193,12 @@ document.addEventListener("DOMContentLoaded", () => {
     });
   });
 
-  openNavBtn.addEventListener("click", () => {
-    panelNav.classList.add("panel--visible");
-    navOverlay.classList.add("nav-overlay--visible");
-    document.body.classList.add("no-scroll");
+  openNavBtns.forEach((openNavBtn) => {
+    openNavBtn.addEventListener("click", () => {
+      panelNav.classList.add("panel--visible");
+      navOverlay.classList.add("nav-overlay--visible");
+      document.body.classList.add("no-scroll");
+    });
   });
 
   closeNavBtn.addEventListener("click", () => {