From: Chris Fulljames <christianfulljames@gmail.com>
Date: Wed, 5 Feb 2025 02:14:40 +0000 (-0500)
Subject: Player tweaks
X-Git-Url: https://littlesong.place/gitweb/gitweb.cgi?a=commitdiff_plain;h=5e2e44f09d3707cb88a213280a2ec3d14e9239f3;p=littlesongplace.git

Player tweaks
---

diff --git a/static/styles.css b/static/styles.css
index daac494..43dc49a 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -322,13 +322,13 @@ div.player {
     margin: 10px;
     box-shadow: 0px 0px 20px 0px;
     border-radius: 10px;
-    min-height: 100px;
+    /*min-height: 100px;*/
     /*border-top: 3px solid;*/
     background: var(--yellow);
 }
 
 div.player-info {
-    height: 50%;
+    /*height: 50%;*/
     display: flex;
     flex-direction: row;
     flex-wrap: nowrap;
@@ -345,7 +345,15 @@ div.player-info {
     justify-content: center;
     align-items: center;
     gap: 10px;
-    height: 50%;
+    /*height: 50%;*/
+    padding: 0px 10px;
+}
+
+.player-volume {
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    align-items: center;
     padding: 10px;
 }
 
@@ -392,7 +400,9 @@ div.player-info {
 }
 
 #volume-slider {
-    width: 25%;
+    width: 100px;
+    max-width: 25%;
+    margin-left: 10px;
 }
 
 .player-label {
diff --git a/templates/base.html b/templates/base.html
index 01647d7..4c1e82a 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -105,7 +105,7 @@
                     <span class="player-time" id="player-total-time">0:00</span>
                     <audio id="player-audio"></audio>
                 </div>
-                <div class="player-controls desktop-only">
+                <div class="player-volume desktop-only">
                     <label class="player-label" for="volume">Volume</label>
                     <input id="volume-slider" name="volume" type="range" min="0" max="1" step="any" value="1"/>
                 </div>