diff --git a/src/renderer/components/ft-list-video/ft-list-video.sass b/src/renderer/components/ft-list-video/ft-list-video.sass index cdebfe2e..9fb776c4 100644 --- a/src/renderer/components/ft-list-video/ft-list-video.sass +++ b/src/renderer/components/ft-list-video/ft-list-video.sass @@ -1 +1,4 @@ @use "../../sass-partials/_ft-list-item" + +.thumbnailLink:hover + outline: 3px solid var(--side-nav-hover-color) diff --git a/src/renderer/components/playlist-info/playlist-info.sass b/src/renderer/components/playlist-info/playlist-info.sass index 28265395..5e359934 100644 --- a/src/renderer/components/playlist-info/playlist-info.sass +++ b/src/renderer/components/playlist-info/playlist-info.sass @@ -3,32 +3,44 @@ .playlistThumbnail img width: 100% - cursor: pointer + @media only screen and (max-width: 800px) + display: none + +.playlistStats + font-size: 15px + +.playlistStats p + color: var(--secondary-text-color) + margin: 0 + +.playlistTitle + margin-bottom: 0.1em + .playlistDescription max-height: 20vh overflow-y: auto + white-space: break-spaces @media only screen and (max-width: 500px) max-height: 10vh .playlistChannel - height: 70px + display: flex + align-items: center + gap: 8px + height: 40px /* Indicates the box can be clicked to navigate */ cursor: pointer .channelThumbnail - width: 70px + width: 40px float: left border-radius: 200px 200px 200px 200px -webkit-border-radius: 200px 200px 200px 200px .channelName - float: left - position: relative - width: 200px - margin-left: 10px - top: 5px + margin: 0 font-size: 15px diff --git a/src/renderer/components/playlist-info/playlist-info.vue b/src/renderer/components/playlist-info/playlist-info.vue index 6a85ea61..1fc1bfbf 100644 --- a/src/renderer/components/playlist-info/playlist-info.vue +++ b/src/renderer/components/playlist-info/playlist-info.vue @@ -8,22 +8,27 @@ @click="playFirstVideo" > -

- {{ title }} -

-

- {{ videoCount }} {{ $t("Playlist.Videos") }} - {{ viewCount }} {{ $t("Playlist.Views") }} - - - {{ $t("Playlist.Last Updated On") }} - - {{ lastUpdated }} -

+ +
+

+ {{ title }} +

+

+ {{ videoCount }} {{ $t("Playlist.Videos") }} - {{ viewCount }} {{ $t("Playlist.Views") }} - + + {{ $t("Playlist.Last Updated On") }} + + {{ lastUpdated }} +

+
+

- {{ description }} -

+ v-text="description" + /> +
+
+
+ + +