diff --git a/src/renderer/assets/feather/folder.svg b/src/renderer/assets/feather/folder.svg
new file mode 100644
index 00000000..134458b9
--- /dev/null
+++ b/src/renderer/assets/feather/folder.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-folder"><path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"></path></svg>
\ No newline at end of file
diff --git a/src/renderer/index.js b/src/renderer/index.js
index 4393c982..c999a24d 100644
--- a/src/renderer/index.js
+++ b/src/renderer/index.js
@@ -597,7 +597,7 @@ const app = new Vue({
                 self.lyrics = []
                 self.richlyrics = []
                 app.getCurrentArtURL();
-                app.getNowPlayingArtwork(42);
+                // app.getNowPlayingArtwork(42); 
                 app.getNowPlayingArtworkBG(32);
                 app.loadLyrics();
 
@@ -2538,56 +2538,67 @@ const app = new Vue({
             }, 200)
         },
 
-        getNowPlayingArtwork(size = 600) {
-            if (typeof this.mk.nowPlayingItem === "undefined") return;
-            let interval = setInterval(() => {
+        // getNowPlayingArtwork(size = 600) {
+        //     if (typeof this.mk.nowPlayingItem === "undefined") return;
+        //     let interval = setInterval(() => {
 
-                try {
-                    if (this.mk.nowPlayingItem && this.mk.nowPlayingItem["id"] != this.currentTrackIDBG && document.querySelector('.app-playback-controls .artwork')) {
-                        this.currentTrackIDBG = this.mk.nowPlayingItem["id"];
-                        if (document.querySelector('.app-playback-controls .artwork') != null) {
-                            clearInterval(interval);
-                        }
-                        if (app.mk.nowPlayingItem.attributes.artwork != null && app.mk.nowPlayingItem.attributes.artwork.url != null && app.mk.nowPlayingItem.attributes.artwork.url!= '' ) {
-                            document.querySelector('.app-playback-controls .artwork').style.setProperty('--artwork', `url("${decodeURI((this.mk["nowPlayingItem"]["attributes"]["artwork"]["url"])).replace('{w}', size).replace('{h}', size)}")`);
-                            try {
-                                clearInterval(interval);
-                            } catch (err) {
-                            }
-                        } else {
-                            this.setLibraryArt()
-                        }
-                    } else if (this.mk.nowPlayingItem["id"] == this.currentTrackID) {
-                        try {
-                            clearInterval(interval);
-                        } catch (err) {
-                        }
-                    }
-                } catch (e) {
-                    if (this.mk.nowPlayingItem && this.mk.nowPlayingItem["id"] && document.querySelector('.app-playback-controls .artwork')) {
-                        this.setLibraryArt()
-                        try {
-                            clearInterval(interval);
-                        } catch (err) {
-                        }
+        //         try {
+        //             if (this.mk.nowPlayingItem && this.mk.nowPlayingItem["id"] != this.currentTrackIDBG && document.querySelector('.app-playback-controls .artwork')) {
+        //                 this.currentTrackIDBG = this.mk.nowPlayingItem["id"];
+        //                 if (document.querySelector('.app-playback-controls .artwork') != null) {
+        //                     clearInterval(interval);
+        //                 }
+        //                 if (app.mk.nowPlayingItem.attributes.artwork != null && app.mk.nowPlayingItem.attributes.artwork.url != null && app.mk.nowPlayingItem.attributes.artwork.url!= '' ) {
+        //                     document.querySelector('.app-playback-controls .artwork').style.setProperty('--artwork', `url("${decodeURI((this.mk["nowPlayingItem"]["attributes"]["artwork"]["url"])).replace('{w}', size).replace('{h}', size)}")`);
+        //                     try {
+        //                         clearInterval(interval);
+        //                     } catch (err) {
+        //                     }
+        //                 } else {
+        //                     this.setLibraryArt()
+        //                 }
+        //             } else if (this.mk.nowPlayingItem["id"] == this.currentTrackID) {
+        //                 try {
+        //                     clearInterval(interval);
+        //                 } catch (err) {
+        //                 }
+        //             }
+        //         } catch (e) {
+        //             if (this.mk.nowPlayingItem && this.mk.nowPlayingItem["id"] && document.querySelector('.app-playback-controls .artwork')) {
+        //                 this.setLibraryArt()
+        //                 try {
+        //                     clearInterval(interval);
+        //                 } catch (err) {
+        //                 }
 
-                    }
+        //             }
 
-                }
-            }, 200)
+        //         }
+        //     }, 200)
 
 
-        },
+        // },
         async getCurrentArtURL(){
             try{
                 this.currentArtUrl = '';
                 if (app.mk.nowPlayingItem != null && app.mk.nowPlayingItem.attributes != null && app.mk.nowPlayingItem.attributes.artwork != null && app.mk.nowPlayingItem.attributes.artwork.url != null && app.mk.nowPlayingItem.attributes.artwork.url!= '' ) 
-                {this.currentArtUrl = (this.mk["nowPlayingItem"]["attributes"]["artwork"]["url"] ?? '').replace('{w}', 50).replace('{h}', 50);
+                {
+                    this.currentArtUrl = (this.mk["nowPlayingItem"]["attributes"]["artwork"]["url"] ?? '').replace('{w}', 50).replace('{h}', 50);
+                    try{
+                    document.querySelector('.app-playback-controls .artwork').style.setProperty('--artwork', `url("${this.currentArtUrl}")`);}
+                    catch (e) {}
                 } else {
                     let data = await this.mk.api.library.song(this.mk.nowPlayingItem.id);
                     if (data != null && data !== "" && data.attributes != null && data.attributes.artwork != null) {
-                        this.currentArtUrl = (data["attributes"]["artwork"]["url"] ?? '').replace('{w}', 50).replace('{h}', 50);;
-                    } else {this.currentArtUrl = ''}
+                        this.currentArtUrl = (data["attributes"]["artwork"]["url"] ?? '').replace('{w}', 50).replace('{h}', 50);
+                        try{
+                            document.querySelector('.app-playback-controls .artwork').style.setProperty('--artwork', `url("${this.currentArtUrl}")`);}
+                        catch (e) {}
+                    } else {this.currentArtUrl = '';
+                    try{
+                        document.querySelector('.app-playback-controls .artwork').style.setProperty('--artwork', `url("${this.currentArtUrl}")`);}
+                    catch (e) {}
+                }
                 }
             }catch(e){
 
diff --git a/src/renderer/style.less b/src/renderer/style.less
index aef12b77..337921d0 100644
--- a/src/renderer/style.less
+++ b/src/renderer/style.less
@@ -3597,7 +3597,7 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
     }
 
     .lyric-body{
-      justify-content: center;
+
     }
   } 
 
@@ -3668,12 +3668,11 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
         font-weight: 600;
         text-align: center;
         font-size: 0.9em;
-        margin-top: 0.25vh;
-        height: 0.9em;
+        height: 1.2em;
         line-height: 0.9em;
         overflow: hidden;
         max-width: 360px;
-      
+
         .song-name-normal {
           height: inherit;
         }
@@ -3687,6 +3686,9 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
       .song-artist {
         font-size: 0.875em;
       }
+      .song-name {
+        margin-top: 0.15vh;
+      }
     }
 
     .app-playback-controls .playback-info {
@@ -3713,7 +3715,7 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
       @bgColor: transparent;
       //height: 16px;
       position: absolute;
-      bottom: -2.5vh;
+      bottom: -1.5vh;
       left: 0px;
       background: @bgColor;
 
diff --git a/src/renderer/views/main.ejs b/src/renderer/views/main.ejs
index 144da55c..e0d409a3 100644
--- a/src/renderer/views/main.ejs
+++ b/src/renderer/views/main.ejs
@@ -70,7 +70,7 @@
                             <div class="app-playback-controls" @mouseover="chrome.progresshover = true"
                                  @mouseleave="chrome.progresshover = false" @contextmenu="nowPlayingContextMenu">
                                 <div class="artwork" @click="drawer.open = false; appMode = 'fullscreen'">
-                                    <img class="small" :url="currentArtUrl"></img>
+                                    <mediaitem-artwork :url="currentArtUrl"></mediaitem-artwork>
                                 </div>
                                 <div class="playback-info">
                                     <div class="song-name">