style: some visual improvements

src/app/home/recent-playlists/playlist-item/playlist-item.component.html

@@ -39,7 +39,7 @@
             >
         </ng-container>
     </div>
-    <span matListItemMeta>
+    <span matListItemMeta class="action-buttons" *ngIf="showActions">
         <button
             *ngIf="item.url || item.filePath"
             mat-icon-button

src/app/home/recent-playlists/playlist-item/playlist-item.component.scss

@@ -45,3 +45,7 @@ mat-list-item {
         }
     }
 }
+
+.action-buttons {
+    align-self: center !important;
+}

src/app/home/recent-playlists/playlist-item/playlist-item.component.ts

@@ -10,6 +10,8 @@ export class PlaylistItemComponent {
     /** Playlist item */
     @Input() item: PlaylistMeta;
 
+    @Input() showActions = true;
+
     /** Emits on playlist selection */
     @Output() playlistClicked: EventEmitter<string> = new EventEmitter();
 

src/app/home/recent-playlists/recent-playlists.component.html

@@ -30,6 +30,7 @@
         <app-playlist-item
             *ngFor="let item of playlists; last as last"
             [item]="item"
+            [showActions]="!sidebarMode"
             (editPlaylistClicked)="openInfoDialog($event)"
             (playlistClicked)="getPlaylist($event)"
             (refreshClicked)="refreshPlaylist($event)"

src/app/home/recent-playlists/recent-playlists.component.scss

@@ -30,7 +30,7 @@
 }
 
 .favorites-icon {
-    margin-left: 16px;
+    padding-left: 36px;
 }
 
 #skeleton-container {

src/app/home/recent-playlists/recent-playlists.component.ts

@@ -2,6 +2,7 @@ import { CdkDragDrop, moveItemInArray } from '@angular/cdk/drag-drop';
 import {
     Component,
     EventEmitter,
+    Input,
     NgZone,
     OnDestroy,
     Output,
@@ -47,6 +48,8 @@ export class RecentPlaylistsComponent implements OnDestroy {
 
     allPlaylistsLoaded$ = this.store.select(selectPlaylistsLoadingFlag);
 
+    @Input() sidebarMode = false;
+
     /** IPC Renderer commands list with callbacks */
     commandsList = [
         new IpcCommand(

src/app/player/components/video-player/sidebar/sidebar.component.html

@@ -46,6 +46,7 @@
 <ng-template #playlistsTemplate>
     <app-recent-playlists
         class="recent-playlists"
+        [sidebarMode]="true"
         [class.electron]="dataService.isElectron"
         (playlistClicked)="selectPlaylist()"
     ></app-recent-playlists>

src/app/player/components/video-player/sidebar/sidebar.component.scss

@@ -22,15 +22,10 @@
         .channels-count {
             font-size: 0.8em;
             color: #ccc;
-            text-transform: lowercase;
         }
     }
 }
 
-.mat-drawer-inner-container {
-    overflow: hidden;
-}
-
 .recent-playlists {
     height: calc(100vh - 60px);
     overflow: auto;