From 7805763b09611492b0b98da999ddc9088e3625fa Mon Sep 17 00:00:00 2001
From: Benjababe <benjamin2471@gmail.com>
Date: Sat, 14 Oct 2023 19:35:15 +0800
Subject: [PATCH] Truncate title of playlist in queue window (#4134)

* truncate title of playlist in watch window

* Update src/renderer/components/watch-video-playlist/watch-video-playlist.vue

Co-authored-by: absidue <48293849+absidue@users.noreply.github.com>

---------

Co-authored-by: absidue <48293849+absidue@users.noreply.github.com>
---
 .../watch-video-playlist/watch-video-playlist.css         | 8 +++++++-
 .../watch-video-playlist/watch-video-playlist.vue         | 7 +++++--
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/renderer/components/watch-video-playlist/watch-video-playlist.css b/src/renderer/components/watch-video-playlist/watch-video-playlist.css
index a6cd0edf34cc5..e859e7d676a28 100644
--- a/src/renderer/components/watch-video-playlist/watch-video-playlist.css
+++ b/src/renderer/components/watch-video-playlist/watch-video-playlist.css
@@ -1,4 +1,10 @@
-.playlistTitle, .channelName {
+.playlistTitle {
+  text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap;
+}
+
+.playlistTitleLink, .channelName {
   text-decoration: none;
   color: inherit;
 }
diff --git a/src/renderer/components/watch-video-playlist/watch-video-playlist.vue b/src/renderer/components/watch-video-playlist/watch-video-playlist.vue
index c679eae6d340c..57050e0c03b62 100644
--- a/src/renderer/components/watch-video-playlist/watch-video-playlist.vue
+++ b/src/renderer/components/watch-video-playlist/watch-video-playlist.vue
@@ -6,9 +6,12 @@
     <div
       v-else
     >
-      <h3>
+      <h3
+        class="playlistTitle"
+        :title="playlistTitle"
+      >
         <router-link
-          class="playlistTitle"
+          class="playlistTitleLink"
           :to="`/playlist/${playlistId}`"
         >
           {{ playlistTitle }}