From c01e9125aaa2b28f5873ce1735cf60241cff64c2 Mon Sep 17 00:00:00 2001
From: Kevin Veen-Birkenbach <kevin@veen.world>
Date: Tue, 14 Jan 2025 21:31:02 +0100
Subject: [PATCH] final solving all of menu bugs

---
 app/static/css/default.css    |  6 +++++-
 app/static/css/navigation.css | 37 ++++++++---------------------------
 2 files changed, 13 insertions(+), 30 deletions(-)

diff --git a/app/static/css/default.css b/app/static/css/default.css
index df624fe..acec413 100644
--- a/app/static/css/default.css
+++ b/app/static/css/default.css
@@ -23,13 +23,17 @@ a {
   flex: 1;
 }
 
+/* Subtle shadow effect */
+.navbar, .card, .dropdown-menu{
+  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
+}
+
 /* Card styles */
 .navbar, .card {
   flex: 1; /* Ensures cards fill the height of their container */
   border-radius: 5px; /* Rounded corners */
   border: 1px solid #ccc; /* Optional border color */
   padding: 10px; /* Inner spacing */
-  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3); /* Subtle shadow effect */
   color: #000000 !important;
   background-color: #f9f9f9;
 }
diff --git a/app/static/css/navigation.css b/app/static/css/navigation.css
index 62d51d3..1957d21 100644
--- a/app/static/css/navigation.css
+++ b/app/static/css/navigation.css
@@ -3,34 +3,13 @@
     display: none;
     opacity: 0;
     visibility: hidden;
-    transition: opacity 0.3s ease, visibility 0.3s ease;
-  }
-  
-  /* Dropdown-Menü beim Hover anzeigen */
-  .nav-item.dropdown:hover > .dropdown-menu,
-  .dropdown-submenu:hover > .dropdown-menu {
-    display: block;
-    opacity: 1;
-    visibility: visible;
-  }
-  
-  /* Dropdown-Menü bei der Klasse "open" anzeigen */
-  .nav-item.dropdown.open > .dropdown-menu,
-  .dropdown-submenu.open > .dropdown-menu {
-    display: block;
-    opacity: 1;
-    visibility: visible;
-  }
-  
-  /* Positionierung von Submenüs */
-  .dropdown-submenu > .dropdown-menu {
+    width: max-content !important; /* Passt die Breite an das breiteste Item an */
+    box-sizing: border-box; /* Berücksichtigt Innenabstand und Rahmen */
+}
+
+/* Positionierung von Submenüs */
+.dropdown-submenu > .dropdown-menu {
     position: absolute;
+    transition: opacity 0.3s ease, visibility 0.3s ease;
     top: 0;
-    left: 100%; /* Rechts ausklappen */
-  }
-  
-  .dropdown-submenu.open > .dropdown-menu {
-    display: block;
-    opacity: 1;
-    visibility: visible;
-  }  
\ No newline at end of file
+}