add a new playlist view header

src/views/AlbumView.vue

@@ -4,7 +4,7 @@
       <Header :album_info="album_info" />
     </div>
     <div class="separator" id="av-sep"></div>
-    <div class="songs rounded">
+    <div class="songs rounded border">
       <SongList :songs="album_songs" />
     </div>
     <div class="separator" id="av-sep"></div>

src/views/FolderView.vue

@@ -127,7 +127,7 @@ export default {
 }
 
 #scrollable {
-  overflow-y: scroll;
+  overflow-y: auto;
   height: calc(100% - $small);
   padding-right: $small;
 }

src/views/PlaylistView.vue

@@ -1,14 +1,13 @@
 <template>
-  <Header />
-  <div class="p-bg rounded">
-    <div class="clip">
-      <div class="scrollable">
-        <SongList :songs="songs"/>
-      </div>
-    </div>
-    <div class="f-artists-p">
-      <FeaturedArtists />
+  <div class="playlist-view rounded">
+    <Header :playlist_info="playlist_info" />
+    <div class="separator no-border"></div>
+
+    <div class="songlist rounded border">
+      <SongList :songs="songs" />
     </div>
+    <div class="separator no-border"></div>
+    <FeaturedArtists />
   </div>
 </template>
 
@@ -16,7 +15,7 @@
 import Header from "@/components/PlaylistView/Header.vue";
 import SongList from "@/components/FolderView/SongList.vue";
 import FeaturedArtists from "@/components/PlaylistView/FeaturedArtists.vue";
-
+import state from "@/composables/state.js";
 export default {
   components: {
     Header,
@@ -25,32 +24,33 @@ export default {
   },
   setup() {
     return {
-      songs: [],
+      songs: state.folder_song_list,
+      playlist_info: {
+        name: "Dax Radio",
+        count: state.folder_song_list.value.length,
+        duration: "0:00",
+        image: "../../assets/images/null.webp",
+        artist: "",
+        artist_image: "",
+      },
     };
   },
 };
 </script>
 
 <style lang="scss">
-.p-bg {
-  position: relative;
-  background: $card-dark;
-  height: calc(100% - 16em);
-  padding: $small;
-}
-
-.p-bg .clip {
-  height: calc(100% - 12em);
-  padding-bottom: $small;
-  border-bottom: solid 1px $separator;
-}
-
-.p-bg .scrollable {
-  height: 100%;
-  border-radius: $small;
-}
-
-.p-bg .f-artists-p {
+.playlist-view {
+  height: calc(100% - 1rem);
   margin-top: $small;
+  overflow: auto;
+
+  &::-webkit-scrollbar {
+    display: none;
+  }
+  .songlist {
+    background-color: $card-dark;
+    padding: $small;
+    min-height: 100%;
+  }
 }
 </style>