From f529832eee79173f767af647ca2dd0205d77fb43 Mon Sep 17 00:00:00 2001
From: Julien Calixte <julien.calixte@theodo.com>
Date: Wed, 29 Apr 2026 11:32:13 +0200
Subject: [PATCH] refactor(notes): scope stacked-note sticky to desktop

Move position: sticky from the global .note rule into the desktop
@media block of the scoped stacked-note components, so mobile no longer
inherits sticky positioning (and no top is set there).
---
 src/components/FluxNote.vue          | 1 -
 src/components/StackedNote.vue       | 2 ++
 src/components/StackedPublicNote.vue | 2 ++
 src/views/PublicNoteView.vue         | 1 -
 4 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/components/FluxNote.vue b/src/components/FluxNote.vue
index fbab422..566809e 100644
--- a/src/components/FluxNote.vue
+++ b/src/components/FluxNote.vue
@@ -211,7 +211,6 @@ $header-height: 40px;
     display: flex;
     flex-direction: column;
     overflow-y: auto;
-    position: sticky;
 
     &:not(:first-child) {
       border-top: 1px solid rgba(18, 19, 58, 0.2);
diff --git a/src/components/StackedNote.vue b/src/components/StackedNote.vue
index 2dfa45b..6846bb3 100644
--- a/src/components/StackedNote.vue
+++ b/src/components/StackedNote.vue
@@ -330,6 +330,8 @@ $border-color: rgba(18, 19, 58, 0.2);
   .stacked-note {
     border-top: 0;
     border-left: 1px solid $border-color;
+    position: sticky;
+    top: 0;
   }
 
   .title-stacked-note {
diff --git a/src/components/StackedPublicNote.vue b/src/components/StackedPublicNote.vue
index f51785a..1d27a64 100644
--- a/src/components/StackedPublicNote.vue
+++ b/src/components/StackedPublicNote.vue
@@ -193,6 +193,8 @@ $border-color: rgba(18, 19, 58, 0.2);
   .stacked-note {
     border-top: 0;
     border-left: 1px solid $border-color;
+    position: sticky;
+    top: 0;
   }
 
   .title-stacked-note {
diff --git a/src/views/PublicNoteView.vue b/src/views/PublicNoteView.vue
index cf8c3e1..f621a82 100644
--- a/src/views/PublicNoteView.vue
+++ b/src/views/PublicNoteView.vue
@@ -241,7 +241,6 @@ watch(
     overflow-y: auto;
     height: 100vh;
     width: 100%;
-    position: sticky;
 
     .title {
       text-align: left;