From d829a63686bf3d188d3cbb760feff176d36461df Mon Sep 17 00:00:00 2001
From: Arbaz Ahmed <51921579+armedev@users.noreply.github.com>
Date: Sat, 24 Apr 2021 03:36:39 +0530
Subject: [PATCH] fix: refactored some styles in jinkie player and removed br
 tag - #865 (#1047)

* refactored some styles in jinkieplayer

* fix: refactored some styles in jinkie player and removed br tag - #865

* fix: refactored some styles in jinkie player and removed br tag - #865

Signed-off-by: armedev <epiratesdev@gmail.com>
---
 ui/src/audioplayer/Player.js | 26 +++++++++++++++-----------
 1 file changed, 15 insertions(+), 11 deletions(-)

diff --git a/ui/src/audioplayer/Player.js b/ui/src/audioplayer/Player.js
index 5a5e3f57e..4f984b14d 100644
--- a/ui/src/audioplayer/Player.js
+++ b/ui/src/audioplayer/Player.js
@@ -35,6 +35,9 @@ const useStyle = makeStyles(
       '&.songTitle': {
         fontWeight: 'bold',
       },
+      '&.songInfo': {
+        display: 'block',
+      },
     },
     qualityInfo: {
       marginTop: '-4px',
@@ -48,13 +51,17 @@ const useStyle = makeStyles(
     },
     player: {
       display: (props) => (props.visible ? 'block' : 'none'),
-    },
-    artistAlbum: {
-      marginTop: '2px',
+      '& .progress-bar-content': {
+        display: 'flex',
+        flexDirection: 'column',
+      },
       '& .play-mode-title': {
         'pointer-events': 'none',
       },
     },
+    artistAlbum: {
+      marginTop: '2px',
+    },
   }),
   { name: 'NDAudioPlayer' }
 )
@@ -81,14 +88,11 @@ const AudioTitle = React.memo(({ audioInfo, isMobile }) => {
         )}
       </span>
       {!isMobile && (
-        <>
-          <br />
-          <div className={classes.artistAlbum}>
-            <span className={`${className} songInfo`}>
-              {`${audioInfo.singer} - ${audioInfo.album}`}
-            </span>
-          </div>
-        </>
+        <div className={classes.artistAlbum}>
+          <span className={`${className} songInfo`}>
+            {`${audioInfo.singer} - ${audioInfo.album}`}
+          </span>
+        </div>
       )}
     </Link>
   )