From 739af215194dcd1586049acb63701c31cd0f9eef Mon Sep 17 00:00:00 2001
From: Joscha <joscha@plugh.de>
Date: Tue, 28 Jan 2025 13:06:55 +0100
Subject: [PATCH] Overflow dropdown menu

---
 gdn-app/src/components/NavbarDropdown.vue | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/gdn-app/src/components/NavbarDropdown.vue b/gdn-app/src/components/NavbarDropdown.vue
index 9623378..8388e5d 100644
--- a/gdn-app/src/components/NavbarDropdown.vue
+++ b/gdn-app/src/components/NavbarDropdown.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { useReposStore } from "@/stores/repos";
-import { offset, useFloating } from "@floating-ui/vue";
+import { offset, size, useFloating } from "@floating-ui/vue";
 import {
   RiAddLine,
   RiArrowDropDownLine,
@@ -18,7 +18,14 @@ const reference = useTemplateRef("reference");
 const floating = useTemplateRef("floating");
 const { floatingStyles } = useFloating(reference, floating, {
   placement: "bottom-start",
-  middleware: [offset(4)],
+  middleware: [
+    offset(4),
+    size({
+      apply({ availableHeight, elements }) {
+        elements.floating.style.maxHeight = `${Math.max(100, availableHeight)}px`;
+      },
+    }),
+  ],
 });
 
 function onAddNewRepo() {
@@ -65,7 +72,7 @@ function onSelectRepo(id: string) {
   <div
     v-if="open"
     ref="floating"
-    class="absolute left-0 top-0 w-fit min-w-48 rounded-md bg-neutral-800 font-light"
+    class="absolute left-0 top-0 w-fit min-w-48 overflow-auto rounded-md bg-neutral-800 font-light"
     :style="floatingStyles"
   >
     <NavbarDropdownEntry