fix(player): audio layout play button colors being overriden

vidstack · Jan 30, 2024 · 86819b0 · 86819b0
1 parent ef57fc3
commit 86819b0
Showing 1 changed file with 8 additions and 2 deletions.
diff --git a/packages/vidstack/player/styles/default/layouts/audio.css b/packages/vidstack/player/styles/default/layouts/audio.css
@@ -92,13 +92,16 @@
   width: var(--audio-play-button-size, 32px);
   height: var(--audio-play-button-size, 32px);
   border-radius: var(--audio-play-button-border-radius, 100%);
-  color: var(--color);
-  background-color: var(--bg-color);
   pointer-events: auto;
   margin-bottom: 2px;
   overflow: hidden;
 }
 
+.vds-audio-layout .vds-play-button {
+  color: var(--color);
+  background-color: var(--bg-color);
+}
+
 :where(.vds-audio-layout .vds-caption-button:not([data-active])) {
   opacity: var(--audio-caption-button-off-opacity, 0.64);
 }
@@ -268,6 +271,9 @@
   --media-slider-height: var(--audio-volume-height, 96px);
   --media-slider-preview-offset: 6px;
   position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 
 :where(.vds-audio-layout .vds-volume-popup) {