Reduce Video.js icon size for mobile devices to 90% (#5705)

* Reduce Video.js icon size for mobile devices to 90% * Adjust audio player height to match font-size
avalonmediasystem · Mar 13, 2024 · 0c9cb61 · 0c9cb61
1 parent 9900b02
commit 0c9cb61
Showing 1 changed file with 10 additions and 4 deletions.
diff --git a/app/javascript/components/Ramp.scss b/app/javascript/components/Ramp.scss
@@ -27,10 +27,16 @@
       .video-js .vjs-big-play-button {
         scale: 1.5;
       }
-    }
 
-    .video-js .vjs-control-bar {
-      font-size: 100% !important;
+      .video-js .vjs-control-bar {
+        font-size: 90% !important;
+      }
+
+      // reduce player height to match with adjusted font-size
+      // for smaller screens
+      .video-js.vjs-audio {
+        min-height: 2.9em;
+      }
     }
   }
 
@@ -367,4 +373,4 @@
       height: 109vh !important;
     }
   }
-}
+}