diff --git a/src/renderer/style.less b/src/renderer/style.less
index 80073b51..53e703ce 100644
--- a/src/renderer/style.less
+++ b/src/renderer/style.less
@@ -2707,8 +2707,8 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
       appearance: none;
       padding:0px;
       border:0px;
-      width: 40px;
-      height: 40px;
+      width: 30px;
+      height: 30px;
       border-radius: 50%;
       background: rgba(50, 50, 50, 0.7);
       cursor: pointer;
@@ -2718,15 +2718,15 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
 
     >.play-btn {
       position: absolute;
-      bottom: 16px;
-      right: 16px;
+      bottom: 14px;
+      left: 14px;
       z-index: 2;
     }
 
     >.menu-btn {
       position: absolute;
-      bottom: 16px;
-      left: 16px;
+      bottom: 14px;
+      right: 14px;
       z-index: 2;
     }
 
diff --git a/src/renderer/views/components/mediaitem-mvview-sp.ejs b/src/renderer/views/components/mediaitem-mvview-sp.ejs
index 02e00174..647c8d88 100644
--- a/src/renderer/views/components/mediaitem-mvview-sp.ejs
+++ b/src/renderer/views/components/mediaitem-mvview-sp.ejs
@@ -25,10 +25,10 @@
                     <div class="button" style="
                     border-radius: 50%;
                     background: rgba(50,50,50,0.7);"
-                         :style="[(!(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('radioStation') && !(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('song')) ? {'margin': '200px',
-                        'margin-left': '250px',
-                        width: '40px',
-                        height: '40px',} :
+                         :style="[(!(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('radioStation') && !(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('song')) ? {'margin': '205px',
+                        'margin-left': '260px', 'margin-bottom': '140px',
+                        width: '30px',
+                        height: '30px',} :
                         {margin: '35px', 'margin-left': '95px',
                         width: '120px',
                         height: '120px',}]" @click="app.playMediaItem(item)">
@@ -40,10 +40,10 @@
                 <div class="button" style="
                 border-radius: 50%;
                 background: rgba(50,50,50,0.7);"
-                     :style="[(!(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('radioStation') && !(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('song')) ? {'margin': '200px',
-                    'margin-left': '250px', 
-                    width: '40px',
-                    height: '40px',} :
+                     :style="[(!(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('radioStation') && !(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('song')) ? {'margin': '205px',
+                    'margin-left': '260px', 'margin-bottom': '140px',
+                    width: '30px',
+                    height: '30px',} :
                     {margin: '35px', 'margin-left': '95px',
                     width: '120px',
                     height: '120px',}]" @click="app.playMediaItem(item)">
diff --git a/src/renderer/views/components/mediaitem-square-sp.ejs b/src/renderer/views/components/mediaitem-square-sp.ejs
index d5635965..9ff92ab9 100644
--- a/src/renderer/views/components/mediaitem-square-sp.ejs
+++ b/src/renderer/views/components/mediaitem-square-sp.ejs
@@ -14,24 +14,24 @@
                     <div class="button" style="
                     border-radius: 50%;
                     background: rgba(50,50,50,0.7);"
-                         :style="[(!(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('radioStation') && !(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('song')) ? {'margin': '140px','position': 'absolute',
-                        width: '40px',
-                        height: '40px',} :
-                        {margin: '35px','position': 'absolute',
+                         :style="[(!(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('radioStation') && !(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('song')) ? {'margin': '153px','position': 'absolute','margin-left': '153px',
+                        width: '30px',
+                        height: '30px',} :
+                        {margin: '35px',display:'none',
                         width: '120px',
-                        height: '120px',}]" @click="app.playMediaItem(item)">
-                        <%- include("../svg/play.svg") %>
+                        height: '120px',}]" @click="clickContext()" >
+                        <%- include("../svg/more.svg") %>
                     </div>
                     <div class="button" style="
                     border-radius: 50%;
                     background: rgba(50,50,50,0.7);"
-                         :style="[(!(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('radioStation') && !(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('song')) ? {'position': 'absolute','margin': '140px',
-                        width: '40px', 'margin-left': '10px',
-                        height: '40px',} :
-                        {display: 'none',margin: '35px',
+                         :style="[(!(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('radioStation') && !(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('song')) ? {'position': 'absolute','margin': '153px',
+                        width: '30px', 'margin-left': '8px',
+                        height: '30px',} :
+                        {margin: '35px','position': 'absolute',
                         width: '120px',
-                        height: '120px',}]" @click="clickContext()">
-                        <%- include("../svg/more.svg") %>
+                        height: '120px',}]" @click="app.playMediaItem(item)">
+                        <%- include("../svg/play.svg") %>
                     </div>
                 </div>
                 <div class="title text-overflow-elipsis"
@@ -52,24 +52,24 @@
                 <div class="button" style="
                border-radius: 50%;
                background: rgba(50,50,50,0.7);"
-                     :style="[(!(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('radioStation') && !(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('song')) ? {'margin': '140px','position': 'absolute',
-                   width: '40px',
-                   height: '40px',} :
-                   {margin: '35px','position': 'absolute',
+                     :style="[(!(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('radioStation') && !(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('song')) ? {'margin': '153px','position': 'absolute','margin-left': '153px',
+                   width: '30px',
+                   height: '30px',} :
+                   {margin: '35px','position': 'absolute', display: 'none',
                    width: '120px',
-                   height: '120px',}]" @click="app.playMediaItem(item)">
-                    <%- include("../svg/play.svg") %>
+                   height: '120px',}]" @click="clickContext()">
+                    <%- include("../svg/more.svg") %>
                 </div>
                 <div class="button" style="
                 border-radius: 50%;
                 background: rgba(50,50,50,0.7);"
-                     :style="[(!(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('radioStation') && !(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('song')) ? {'position': 'absolute','margin': '140px',
-                    width: '40px', 'margin-left': '10px',
-                    height: '40px',} :
-                    {display: 'none',margin: '35px','position': 'absolute',
+                     :style="[(!(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('radioStation') && !(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('song')) ? {'position': 'absolute','margin': '153px',
+                    width: '30px', 'margin-left': '8px',
+                    height: '30px',} :
+                    {margin: '35px','position': 'absolute',
                     width: '120px',
-                    height: '120px',}]" @click="clickContext()">
-                    <%- include("../svg/more.svg") %>
+                    height: '120px',}]" @click="app.playMediaItem(item)" >
+                    <%- include("../svg/play.svg") %>
                 </div>
             </div>