From 1daee314a24b1dc43b16296bac3267eef33a04a2 Mon Sep 17 00:00:00 2001
From: ernstmul <ernst.mulders@gmail.com>
Date: Mon, 17 Feb 2025 10:39:05 +0100
Subject: [PATCH] Fix scrollposition on menu open mobile

---
 src/lib/layout/footer.svelte |  1 -
 src/lib/layout/shell.svelte  | 25 ++++++++++++-------------
 2 files changed, 12 insertions(+), 14 deletions(-)

diff --git a/src/lib/layout/footer.svelte b/src/lib/layout/footer.svelte
index 05ff3350d..1b15af2ae 100644
--- a/src/lib/layout/footer.svelte
+++ b/src/lib/layout/footer.svelte
@@ -111,7 +111,6 @@
     }
     footer {
         margin-block-start: auto;
-        margin-inline: 2rem;
         padding-block: 1rem;
         display: flex;
         flex-direction: column;
diff --git a/src/lib/layout/shell.svelte b/src/lib/layout/shell.svelte
index b600e4f0e..cd6dd20a2 100644
--- a/src/lib/layout/shell.svelte
+++ b/src/lib/layout/shell.svelte
@@ -27,7 +27,7 @@
     export let projects: Array<Models.Project> = [];
 
     $: selectedProject = loadedProjects.find((project) => project.isSelected);
-    let y: number;
+    let yOnMenuOpen: number;
     let showContentTransition = false;
     let timeoutId: NodeJS.Timeout;
 
@@ -45,13 +45,14 @@
     });
 
     $: {
-        $isSidebarOpen
-            ? (document.body.style.overflow = 'hidden')
-            : (document.body.style.overflow = '');
-
-        $isSidebarOpen
-            ? (document.body.style.maxHeight = '100vh')
-            : (document.body.style.maxHeight = '');
+        if ($isSidebarOpen) {
+            yOnMenuOpen = window.scrollY;
+            document.body.style.top = `-${window.scrollY}px`;
+            document.body.style.position = 'fixed';
+        } else if (!$isSidebarOpen) {
+            document.body.style.position = 'static';
+            window.scrollTo(0, yOnMenuOpen);
+        }
     }
 
     /**
@@ -116,12 +117,11 @@
     };
 
     onDestroy(() => {
-        document.body.style.overflow = '';
-        document.body.style.maxHeight = '';
+        document.body.style.position = 'static';
     });
 </script>
 
-<svelte:window bind:scrollY={y} on:resize={handleResize} />
+<svelte:window on:resize={handleResize} />
 <main
     class:grid-with-side={showSideNavigation}
     class:is-open={$showSubNavigation}
@@ -209,8 +209,7 @@
     }
 
     .overlay {
-        margin-top: calc(-1 * var(--base-48));
-        position: absolute;
+        position: fixed;
         width: 100vw;
         height: 100vh;
         right: 0;