From 9c58dd7f6e8203b95ec02e0dafec378faeacd5ae Mon Sep 17 00:00:00 2001
From: Bill Thornton <billt2006@gmail.com>
Date: Thu, 30 Sep 2021 10:07:32 -0400
Subject: [PATCH] Fix audio player overlapping on small screens

---
 src/components/remotecontrol/remotecontrol.scss | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/components/remotecontrol/remotecontrol.scss b/src/components/remotecontrol/remotecontrol.scss
index 4081c68c5c..175c4b1dce 100644
--- a/src/components/remotecontrol/remotecontrol.scss
+++ b/src/components/remotecontrol/remotecontrol.scss
@@ -327,8 +327,13 @@
     }
 
     .nowPlayingPageImageContainer {
+        flex-grow: 1;
+        flex-shrink: 1;
         width: 100%;
-        margin: auto auto 0.5em;
+        min-height: 0;
+        margin: 0 auto 0.5em;
+        display: flex;
+        align-items: center;
     }
 
     .nowPlayingPageImageContainerNoAlbum .cardImageContainer .cardImageIcon {
@@ -337,7 +342,9 @@
     }
 
     .nowPlayingInfoControls {
-        margin: 0.5em 0 1em 0;
+        flex-grow: 0;
+        flex-shrink: 1;
+        margin: 0.5em 0 0;
         width: 100%;
         -webkit-box-pack: start !important;
         -webkit-justify-content: start !important;
@@ -400,7 +407,9 @@
     }
 
     .nowPlayingPageImage.nowPlayingPageImageAudio {
-        width: 100%;
+        width: auto;
+        max-width: 100%;
+        max-height: 100%;
     }
 
     .nowPlayingPageImageContainer.nowPlayingPageImagePoster {