From f25548eb8134054d91f8721a308e63a00f6b43a6 Mon Sep 17 00:00:00 2001
From: Manuel Holtgrewe <manuel.holtgrewe@bih-charite.de>
Date: Tue, 6 Feb 2024 11:13:31 +0100
Subject: [PATCH] feat: make left-side navigation bar sticky (#439) (#441)

---
 frontend/src/views/GeneDetailView/GeneDetailView.vue         | 5 ++++-
 frontend/src/views/SeqvarDetailsView/SeqvarDetailsView.vue   | 5 ++++-
 .../src/views/StrucvarDetailsView/StrucvarDetailsView.vue    | 5 ++++-
 3 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/frontend/src/views/GeneDetailView/GeneDetailView.vue b/frontend/src/views/GeneDetailView/GeneDetailView.vue
index 17f33d8a..bdb62338 100644
--- a/frontend/src/views/GeneDetailView/GeneDetailView.vue
+++ b/frontend/src/views/GeneDetailView/GeneDetailView.vue
@@ -147,7 +147,10 @@ const SECTIONS: Section[] = [
       <v-container fluid>
         <v-row>
           <v-col cols="2">
-            <div v-if="geneInfoStore.storeState == StoreState.Active">
+            <div
+              v-if="geneInfoStore.storeState == StoreState.Active"
+              style="position: sticky; top: 20px"
+            >
               <v-list v-model:opened="openedSection" rounded="lg">
                 <BookmarkListItem :id="geneInfoStore.hgncId ?? ''" :type="'gene'" />
 
diff --git a/frontend/src/views/SeqvarDetailsView/SeqvarDetailsView.vue b/frontend/src/views/SeqvarDetailsView/SeqvarDetailsView.vue
index 9fbae112..f84db87d 100644
--- a/frontend/src/views/SeqvarDetailsView/SeqvarDetailsView.vue
+++ b/frontend/src/views/SeqvarDetailsView/SeqvarDetailsView.vue
@@ -276,7 +276,10 @@ const SECTIONS: { [key: string]: Section[] } = {
       <v-container fluid>
         <v-row>
           <v-col cols="2">
-            <div v-if="seqvarInfoStore.storeState == StoreState.Active">
+            <div
+              v-if="seqvarInfoStore.storeState == StoreState.Active"
+              style="position: sticky; top: 20px"
+            >
               <v-list v-model:opened="openedSection" density="compact" rounded="lg">
                 <BookmarkListItem :id="idForBookmark" type="seqvar" />
 
diff --git a/frontend/src/views/StrucvarDetailsView/StrucvarDetailsView.vue b/frontend/src/views/StrucvarDetailsView/StrucvarDetailsView.vue
index c2abb243..68093324 100644
--- a/frontend/src/views/StrucvarDetailsView/StrucvarDetailsView.vue
+++ b/frontend/src/views/StrucvarDetailsView/StrucvarDetailsView.vue
@@ -296,7 +296,10 @@ const SECTIONS: { [key: string]: Section[] } = {
       <v-container fluid>
         <v-row>
           <v-col cols="2">
-            <div v-if="strucvarInfoStore.storeState == StoreState.Active">
+            <div
+              v-if="strucvarInfoStore.storeState == StoreState.Active"
+              style="position: sticky; top: 20px"
+            >
               <v-list v-model:opened="openedSection" density="compact" rounded="lg">
                 <BookmarkListItem :id="idForBookmark" type="strucvar" />