From a32de29d25a06c54aed4ad6feb0a6f7bf921ae53 Mon Sep 17 00:00:00 2001
From: Meleki <meleki@gott.local>
Date: Tue, 3 Mar 2026 09:29:58 +0100
Subject: [PATCH] =?UTF-8?q?style:=20Card-Dropdown=20=C3=B6ffnet=20nach=20l?=
 =?UTF-8?q?inks=20unten=20statt=20rechts?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Position: unterhalb des Trigger-Buttons
- Rechte Kante des Dropdowns an rechter Kante des Buttons ausgerichtet
- Fallback: nach oben wenn unten kein Platz
---
 wwwroot/js/pages/dashboard.js | 68 +++++++++++++++--------------------
 1 file changed, 28 insertions(+), 40 deletions(-)

diff --git a/wwwroot/js/pages/dashboard.js b/wwwroot/js/pages/dashboard.js
index ba8237c..f40b594 100644
--- a/wwwroot/js/pages/dashboard.js
+++ b/wwwroot/js/pages/dashboard.js
@@ -78,27 +78,21 @@ registerPage('dashboard', {
       menuTrigger.addEventListener('click', (e) => {
         e.stopPropagation();
         closeAllCardMenus();
-        // Position fixed dropdown to the right of trigger
+        // Position fixed dropdown below trigger, aligned to the left
         const rect = menuTrigger.getBoundingClientRect();
-        menuDropdown.style.top = `${rect.top}px`;
-        menuDropdown.style.left = `${rect.right + 4}px`;
-        menuDropdown.hidden = !menuDropdown.hidden;
-        // Adjust if off-screen
-        if (!menuDropdown.hidden) {
-          const dropRect = menuDropdown.getBoundingClientRect();
-          // If off-screen right, flip to left side
-          if (dropRect.right > window.innerWidth) {
-            menuDropdown.style.left = `${rect.left - dropRect.width - 4}px`;
-          }
-          // If off-screen bottom, align to bottom of viewport
-          if (dropRect.bottom > window.innerHeight) {
-            menuDropdown.style.top = `${window.innerHeight - dropRect.height - 8}px`;
-          }
-          // Safety: if off-screen left after flip
-          const finalRect = menuDropdown.getBoundingClientRect();
-          if (finalRect.left < 0) {
-            menuDropdown.style.left = '8px';
-          }
+        menuDropdown.hidden = false;
+        const dropRect = menuDropdown.getBoundingClientRect();
+        // Position: below trigger, right edge aligned with trigger's right edge
+        menuDropdown.style.top = `${rect.bottom + 4}px`;
+        menuDropdown.style.left = `${rect.right - dropRect.width}px`;
+        // Adjust if off-screen bottom
+        if (rect.bottom + 4 + dropRect.height > window.innerHeight) {
+          menuDropdown.style.top = `${rect.top - dropRect.height - 4}px`;
+        }
+        // Safety: if off-screen left
+        const finalRect = menuDropdown.getBoundingClientRect();
+        if (finalRect.left < 0) {
+          menuDropdown.style.left = '8px';
         }
       });
       chatBtn.addEventListener('click', (e) => {
@@ -230,27 +224,21 @@ registerPage('dashboard', {
       menuTrigger.addEventListener('click', (e) => {
         e.stopPropagation();
         closeAllCardMenus();
-        // Position fixed dropdown to the right of trigger
+        // Position fixed dropdown below trigger, aligned to the left
         const rect = menuTrigger.getBoundingClientRect();
-        menuDropdown.style.top = `${rect.top}px`;
-        menuDropdown.style.left = `${rect.right + 4}px`;
-        menuDropdown.hidden = !menuDropdown.hidden;
-        // Adjust if off-screen
-        if (!menuDropdown.hidden) {
-          const dropRect = menuDropdown.getBoundingClientRect();
-          // If off-screen right, flip to left side
-          if (dropRect.right > window.innerWidth) {
-            menuDropdown.style.left = `${rect.left - dropRect.width - 4}px`;
-          }
-          // If off-screen bottom, align to bottom of viewport
-          if (dropRect.bottom > window.innerHeight) {
-            menuDropdown.style.top = `${window.innerHeight - dropRect.height - 8}px`;
-          }
-          // Safety: if off-screen left after flip
-          const finalRect = menuDropdown.getBoundingClientRect();
-          if (finalRect.left < 0) {
-            menuDropdown.style.left = '8px';
-          }
+        menuDropdown.hidden = false;
+        const dropRect = menuDropdown.getBoundingClientRect();
+        // Position: below trigger, right edge aligned with trigger's right edge
+        menuDropdown.style.top = `${rect.bottom + 4}px`;
+        menuDropdown.style.left = `${rect.right - dropRect.width}px`;
+        // Adjust if off-screen bottom
+        if (rect.bottom + 4 + dropRect.height > window.innerHeight) {
+          menuDropdown.style.top = `${rect.top - dropRect.height - 4}px`;
+        }
+        // Safety: if off-screen left
+        const finalRect = menuDropdown.getBoundingClientRect();
+        if (finalRect.left < 0) {
+          menuDropdown.style.left = '8px';
         }
       });
       menuDropdown.querySelector('[data-action="files"]').addEventListener('click', (e) => {