From 68022971cd8d2fbc730183d5896a67de841b87c0 Mon Sep 17 00:00:00 2001
From: Julien Calixte <julien.calixte@theodo.com>
Date: Wed, 29 Apr 2026 11:32:23 +0200
Subject: [PATCH] refactor(notes): restore fixed mobile heights for scroll math

Re-pin .note and .stacked-note to 100dvh on mobile and bring back the
container height in useResizeContainer so (index + 1) * height has a
reachable scroll target. Switch the polled scroll helper to that same
formula instead of offsetTop.
---
 src/components/FluxNote.vue                 |  1 +
 src/components/StackedNote.vue              |  1 +
 src/hooks/useResizeContainer.hook.ts        |  4 +++-
 src/hooks/useRouteQueryStackedNotes.hook.ts | 12 ++++++------
 4 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/src/components/FluxNote.vue b/src/components/FluxNote.vue
index 566809e..44e89aa 100644
--- a/src/components/FluxNote.vue
+++ b/src/components/FluxNote.vue
@@ -256,6 +256,7 @@ $header-height: 40px;
 
   .note {
     width: 100vw;
+    height: 100dvh;
     overflow-y: visible;
   }
 
diff --git a/src/components/StackedNote.vue b/src/components/StackedNote.vue
index 6846bb3..30f4b13 100644
--- a/src/components/StackedNote.vue
+++ b/src/components/StackedNote.vue
@@ -313,6 +313,7 @@ $border-color: rgba(18, 19, 58, 0.2);
 @media screen and (max-width: 768px) {
   .stacked-note {
     padding: 0 0.75rem 1rem;
+    height: 100dvh;
 
     section {
       padding: 1rem 0 2rem;
diff --git a/src/hooks/useResizeContainer.hook.ts b/src/hooks/useResizeContainer.hook.ts
index 2fa6462..8ecf3fb 100644
--- a/src/hooks/useResizeContainer.hook.ts
+++ b/src/hooks/useResizeContainer.hook.ts
@@ -18,7 +18,9 @@ export const useResizeContainer = (
       return
     }
 
-    if (!isMobile.value) {
+    if (isMobile.value) {
+      container.style.height = `${(stackedNotes.value.length + 1) * 100}dvh`
+    } else {
       container.style.minWidth = `${
         getNoteWidth() * (stackedNotes.value.length + 1)
       }px`
diff --git a/src/hooks/useRouteQueryStackedNotes.hook.ts b/src/hooks/useRouteQueryStackedNotes.hook.ts
index b5b1292..edb959b 100644
--- a/src/hooks/useRouteQueryStackedNotes.hook.ts
+++ b/src/hooks/useRouteQueryStackedNotes.hook.ts
@@ -52,17 +52,17 @@ export const useRouteQueryStackedNotes = () => {
     index: number,
     attempts = 30
   ) => {
-    if (attempts <= 0) {
-      scrollToNote((index + 1) * height.value)
-      return
-    }
-
     const element = document.querySelector(
       `.note-${cleanNoteId}`
     ) as HTMLElement | null
 
     if (element) {
-      scrollToNote(element.offsetTop)
+      scrollToNote((index + 1) * element.clientHeight)
+      return
+    }
+
+    if (attempts <= 0) {
+      scrollToNote((index + 1) * height.value)
       return
     }