From 821d5ca73e0f73328dc048a39e622b731a5b2335 Mon Sep 17 00:00:00 2001
From: Emma <MarmadileManteater@proton.me>
Date: Thu, 15 Feb 2024 03:02:21 -0500
Subject: [PATCH] Fix overflow issue with share playlist icon drop-down (#4677)

* Set share playlist dropdown position to `center` w/ media query

* Remove overflow-y as it causes the overflow issue

Originally, when this overflow-y was added, the share playlist dropdown went straight down, so there would no need for the content to be able to overflow in the y direction. (FreeTubeApp/FreeTube#2281)

Now, the dropdown swings out to the left by default, and even when it is centered, it still overflows the width of the container as an intentional part of the design.

* Remove unnecessary whitespace
---
 src/renderer/components/playlist-info/playlist-info.scss | 7 +++++++
 src/renderer/components/playlist-info/playlist-info.vue  | 1 +
 src/renderer/views/Playlist/Playlist.scss                | 1 -
 3 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/renderer/components/playlist-info/playlist-info.scss b/src/renderer/components/playlist-info/playlist-info.scss
index 3fb13c0c0..7fd3d7d75 100644
--- a/src/renderer/components/playlist-info/playlist-info.scss
+++ b/src/renderer/components/playlist-info/playlist-info.scss
@@ -72,3 +72,10 @@
   column-gap: 8px;
   justify-content: flex-end;
 }
+
+@media only screen and (max-width: 1250px) {
+  :deep(.sharePlaylistIcon .iconDropdown) {
+    inset-inline-start: auto;
+    inset-inline-end: auto;
+  }
+}
diff --git a/src/renderer/components/playlist-info/playlist-info.vue b/src/renderer/components/playlist-info/playlist-info.vue
index d5af7424e..1544b7388 100644
--- a/src/renderer/components/playlist-info/playlist-info.vue
+++ b/src/renderer/components/playlist-info/playlist-info.vue
@@ -166,6 +166,7 @@
         <ft-share-button
           v-if="sharePlaylistButtonVisible"
           :id="id"
+          class="sharePlaylistIcon"
           :dropdown-position-y="description ? 'top' : 'bottom'"
           share-target-type="Playlist"
         />
diff --git a/src/renderer/views/Playlist/Playlist.scss b/src/renderer/views/Playlist/Playlist.scss
index e8c2b7681..939f3a5cc 100644
--- a/src/renderer/views/Playlist/Playlist.scss
+++ b/src/renderer/views/Playlist/Playlist.scss
@@ -7,7 +7,6 @@
   box-sizing: border-box;
   block-size: calc(100vh - 132px);
   margin-inline-end: 1em;
-  overflow-y: auto;
   padding: 10px;
   position: sticky;
   inset-block-start: 96px;