From 681960ed9e59322cf9ba669b5076093a1b8c7f7c Mon Sep 17 00:00:00 2001
From: Shekhar0109 <shekharshashankara@gmail.com>
Date: Wed, 3 Dec 2025 20:24:34 +0530
Subject: [PATCH 1/2] fix(frontend): prevent back-to-top button overlapping
 footer (#4966)

---
 frontend/src/components/VScrollButton.vue |  2 +-
 frontend/src/layouts/content-layout.vue   | 16 +++++++------
 frontend/src/layouts/search-layout.vue    | 28 ++++++++++++-----------
 3 files changed, 25 insertions(+), 21 deletions(-)

diff --git a/frontend/src/components/VScrollButton.vue b/frontend/src/components/VScrollButton.vue
index 98731e1fe7d..bb27eb82f80 100644
--- a/frontend/src/components/VScrollButton.vue
+++ b/frontend/src/components/VScrollButton.vue
@@ -63,7 +63,7 @@ const scrollToTop = () => {
   <button
     :aria-label="$t('browsePage.aria.scroll')"
     type="button"
-    class="scroll fixed bottom-4 mb-4 ms-auto h-14 w-14 rounded-full bg-primary text-center text-over-dark transition-all duration-100 ease-linear hover:bg-primary-hover hover:shadow-md"
+    class="scroll sticky bottom-4 mb-4 ms-auto h-14 w-14 rounded-full bg-primary text-center text-over-dark transition-all duration-100 ease-linear hover:bg-primary-hover hover:shadow-md"
     :class="hClass"
     @click="scrollToTop"
     @keydown.tab.exact="$emit('tab', $event)"
diff --git a/frontend/src/layouts/content-layout.vue b/frontend/src/layouts/content-layout.vue
index 73f6eb5ff89..83eae3d8715 100644
--- a/frontend/src/layouts/content-layout.vue
+++ b/frontend/src/layouts/content-layout.vue
@@ -39,15 +39,17 @@ provide(ShowScrollButtonKey, showScrollButton)
     />
 
     <div class="main-page flex h-full w-full min-w-0 flex-col justify-between">
-      <slot />
-      <VFooter mode="internal" class="border-t border-default bg-default" />
+  <slot />
+
+  <VScrollButton
+    v-show="showScrollButton"
+    :is-filter-sidebar-visible="false"
+    data-testid="scroll-button"
+  />
+
+  <VFooter mode="internal" class="border-t border-default bg-default" />
     </div>
 
-    <VScrollButton
-      v-show="showScrollButton"
-      :is-filter-sidebar-visible="false"
-      data-testid="scroll-button"
-    />
   </div>
 </template>
 
diff --git a/frontend/src/layouts/search-layout.vue b/frontend/src/layouts/search-layout.vue
index f83a92d2c5a..ed3b71d6f01 100644
--- a/frontend/src/layouts/search-layout.vue
+++ b/frontend/src/layouts/search-layout.vue
@@ -87,19 +87,21 @@ provide(ShowScrollButtonKey, showScrollButton)
       <VSafeBrowsing class="border-t border-default px-10 py-8" />
     </aside>
 
-    <div
-      id="main-page"
-      class="main-page flex h-full w-full min-w-0 flex-col justify-between overflow-y-auto"
-    >
-      <slot />
-      <VFooter mode="content" class="border-t border-default bg-default" />
-    </div>
-
-    <VScrollButton
-      v-show="showScrollButton"
-      :is-filter-sidebar-visible="isSidebarVisible"
-      data-testid="scroll-button"
-    />
+   <div
+  id="main-page"
+  class="main-page flex h-full w-full min-w-0 flex-col justify-between overflow-y-auto"
+  >
+  <slot />
+
+  <VScrollButton
+    v-show="showScrollButton"
+    :is-filter-sidebar-visible="isSidebarVisible"
+    data-testid="scroll-button"
+  />
+
+  <VFooter mode="content" class="border-t border-default bg-default" />
+   </div>
+
   </div>
 </template>
 

From e6f039be72f3775344881217ba8e959cff4a92b4 Mon Sep 17 00:00:00 2001
From: Shekhar0109 <shekharshashankara@gmail.com>
Date: Wed, 3 Dec 2025 21:01:39 +0530
Subject: [PATCH 2/2] chore: fix prettier formatting

---
 frontend/src/layouts/content-layout.vue | 15 +++++++--------
 frontend/src/layouts/search-layout.vue  | 25 ++++++++++++-------------
 2 files changed, 19 insertions(+), 21 deletions(-)

diff --git a/frontend/src/layouts/content-layout.vue b/frontend/src/layouts/content-layout.vue
index 83eae3d8715..ed57707783b 100644
--- a/frontend/src/layouts/content-layout.vue
+++ b/frontend/src/layouts/content-layout.vue
@@ -39,17 +39,16 @@ provide(ShowScrollButtonKey, showScrollButton)
     />
 
     <div class="main-page flex h-full w-full min-w-0 flex-col justify-between">
-  <slot />
+      <slot />
 
-  <VScrollButton
-    v-show="showScrollButton"
-    :is-filter-sidebar-visible="false"
-    data-testid="scroll-button"
-  />
+      <VScrollButton
+        v-show="showScrollButton"
+        :is-filter-sidebar-visible="false"
+        data-testid="scroll-button"
+      />
 
-  <VFooter mode="internal" class="border-t border-default bg-default" />
+      <VFooter mode="internal" class="border-t border-default bg-default" />
     </div>
-
   </div>
 </template>
 
diff --git a/frontend/src/layouts/search-layout.vue b/frontend/src/layouts/search-layout.vue
index ed3b71d6f01..f36b80f2805 100644
--- a/frontend/src/layouts/search-layout.vue
+++ b/frontend/src/layouts/search-layout.vue
@@ -87,21 +87,20 @@ provide(ShowScrollButtonKey, showScrollButton)
       <VSafeBrowsing class="border-t border-default px-10 py-8" />
     </aside>
 
-   <div
-  id="main-page"
-  class="main-page flex h-full w-full min-w-0 flex-col justify-between overflow-y-auto"
-  >
-  <slot />
-
-  <VScrollButton
-    v-show="showScrollButton"
-    :is-filter-sidebar-visible="isSidebarVisible"
-    data-testid="scroll-button"
-  />
+    <div
+      id="main-page"
+      class="main-page flex h-full w-full min-w-0 flex-col justify-between overflow-y-auto"
+    >
+      <slot />
 
-  <VFooter mode="content" class="border-t border-default bg-default" />
-   </div>
+      <VScrollButton
+        v-show="showScrollButton"
+        :is-filter-sidebar-visible="isSidebarVisible"
+        data-testid="scroll-button"
+      />
 
+      <VFooter mode="content" class="border-t border-default bg-default" />
+    </div>
   </div>
 </template>