From a11440e18fadfd05acd6a06df9364297e4a5dfae Mon Sep 17 00:00:00 2001
From: Timo De Meyst <timo.demeyst@ugent.be>
Date: Tue, 13 May 2025 00:54:45 +0200
Subject: [PATCH] feat: pagina scrollt automatisch zodat antwoorden in zicht
 komen als ze uitgeklapt worden

---
 frontend/src/components/SingleQuestion.vue | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/SingleQuestion.vue b/frontend/src/components/SingleQuestion.vue
index 5d587a39..daaf1e43 100644
--- a/frontend/src/components/SingleQuestion.vue
+++ b/frontend/src/components/SingleQuestion.vue
@@ -12,9 +12,22 @@
     }>();
 
     const expanded = ref(false);
+    const answersContainer = ref<HTMLElement | null>(null); // Ref for the answers container
 
     function toggle(): void {
         expanded.value = !expanded.value;
+
+        // Scroll to the answers container if expanded
+        if (expanded.value && answersContainer.value) { 
+            setTimeout(function () {
+                if (answersContainer.value) {
+                    answersContainer.value.scrollIntoView({
+                        behavior: "smooth",
+                        block: "start",
+                    });
+                }
+            }, 100);
+        }
     }
 
     function formatDate(timestamp: string | Date): string {
@@ -109,7 +122,8 @@
             </button>
 
             <div
-                v-if="expanded"
+                v-show="expanded"
+                ref="answersContainer"
                 class="mt-3 pl-4 border-l-2 border-blue-200 space-y-2"
             >
                 <div