bugfixes

src/app/components/board/task/task-menu/task-menu.component.scss

@@ -1,7 +1,7 @@
 section {
   position: absolute;
   top: 30px;
-  left: 40px;
+  right: 45px;
   text-align: center;
   width: fit-content;
   height: fit-content;

src/app/components/board/task/task.component.html

@@ -1,4 +1,5 @@
-<section (click)="handleMenuButtonClick($event, task.id)">
+<section>
+  <div (click)="handleMenuButtonClick($event, task.id)">
     <div
       class="content"
       draggable="true"
@@ -11,10 +12,7 @@
         >
           {{ task.category }}
         </div>
-      <div
-        class="menu-btn"
-        (click)="handleMenuButtonClick($event, task.status)"
-      >
+        <div class="menu-btn" (click)="handleMenuButtonClick($event, task.id)">
           <img
             class="menu-img"
             src="./../../../../assets/img/board/menu.svg"
@@ -52,6 +50,7 @@
         <div class="footer-priority prio-{{ task.priority }}"></div>
       </div>
     </div>
+  </div>
   @if (isMenuOpen){
   <app-task-menu [boardTaskStatus]="task.status"></app-task-menu>
   }

src/app/components/board/task/task.component.ts

@@ -46,20 +46,23 @@ export class TaskComponent implements OnInit, OnDestroy {
     this.isPageViewMedia = window.innerWidth <= 650;
   }
 
-  handleMenuButtonClick(event: MouseEvent, taskIdOrStatus: string | undefined) {
+  handleMenuButtonClick(event: MouseEvent, taskId: string | undefined) {
     event.stopPropagation();
     const targetElement = event.target as HTMLElement;
     targetElement.classList.contains('menu-btn') ||
     targetElement.classList.contains('menu-img')
-      ? this.openTaskMenu(taskIdOrStatus)
-      : this.openTaskDetailsOverlay(taskIdOrStatus);
+      ? this.toggleTaskMenu()
+      : this.openTaskDetailsOverlay(taskId);
   }
 
-  openTaskMenu(taskStatus: string | undefined) {
+  toggleTaskMenu() {
     this.isMenuOpen = !this.isMenuOpen;
   }
 
   openTaskDetailsOverlay(taskId: string | undefined) {
+    if (this.isMenuOpen) {
+      this.toggleTaskMenu();
+    }
     this.isPageViewMedia
       ? this.router.navigate(['/task', taskId])
       : this.overlayService.setOverlayData('taskOverlay', taskId);