From 9f1c03e0acb6942ced7817178d99e65648278441 Mon Sep 17 00:00:00 2001
From: Tixie <admin@glitch.family>
Date: Sat, 22 Feb 2020 20:45:49 +0100
Subject: [PATCH] fix context menu alignements in controls

---
 src/components/Controls.svelte   | 2 +-
 src/components/PopperMenu.svelte | 7 ++++++-
 src/components/Queue.svelte      | 4 ++--
 3 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/src/components/Controls.svelte b/src/components/Controls.svelte
index befc4c3..81adebe 100644
--- a/src/components/Controls.svelte
+++ b/src/components/Controls.svelte
@@ -24,7 +24,7 @@
     </div>
 
     <div class="controls__menu">
-        <Popper>
+        <Popper needOffset={false}>
             <button
                 slot="btn"
                 class="controls__menuBtn"
diff --git a/src/components/PopperMenu.svelte b/src/components/PopperMenu.svelte
index 7d69b6a..0967545 100644
--- a/src/components/PopperMenu.svelte
+++ b/src/components/PopperMenu.svelte
@@ -19,6 +19,7 @@ import detectOverflow from '@popperjs/core/lib/utils/detectOverflow.js';
 let btn
 let content
 let isActive = false
+export let needOffset
 
 export function open () {
     isActive = true
@@ -39,7 +40,11 @@ onMount(() => {
             name: 'offset',
             options: {
                 offset: ({ reference, popper }) => {
-                    return [-10, -reference.width - 5];
+                    if (needOffset) {
+                        return [-10, -reference.width - 5];
+                    } else {
+                        return [5, -reference.width - 5];
+                    }
                 }
             }
         },
diff --git a/src/components/Queue.svelte b/src/components/Queue.svelte
index ce68166..56232af 100644
--- a/src/components/Queue.svelte
+++ b/src/components/Queue.svelte
@@ -14,7 +14,7 @@
                 </div>
             </div>
             {#if $next}
-                <Popper>
+                <Popper needOffset={true}>
                     <button slot="btn" class="track__menu" aria-label="track menu"><IconMenu></IconMenu></button>
                     <div slot="content" class="contextMenu__list">
                         <ContextMenu track={$next}></ContextMenu>
@@ -36,7 +36,7 @@
                         <DistanceDate date={track.referer.date} />
                     </div>
                 </div>
-                <Popper>
+                <Popper needOffset={true}>
                     <button slot="btn" class="track__menu" aria-label="track menu"><IconMenu></IconMenu></button>
                     <div slot="content" class="contextMenu__list">
                         <ContextMenu track={track}></ContextMenu>