fix: fixed wt-player colors [WTEL-3948]

webitel · Nov 30, 2023 · 0f83839 · 0f83839
1 parent 0520f31
commit 0f83839
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 0 deletions.
diff --git a/src/components/wt-player/_variables.scss b/src/components/wt-player/_variables.scss
@@ -5,6 +5,10 @@
   --plyr-audio-controls-background: var(--content-wrapper-color);
   --plyr-control-icon-size: var(--icon-md-size);
   --plyr-audio-control-background-hover: transparent;
+  --plyr-audio-progress-buffered-background: var(--dp-14-surface-color); // loaded color
+  --wt-player-audio-progress-background: var(--wt-slider-background-color); // not played color
+  --plyr-tooltip-background: var(--wt-tooltip-background-color);
+  --plyr-tooltip-color: var(--wt-tooltip-text-color);
 
   // --plyr-control-toggle-checked-background: var(--main-color);
   --player-close-icon-transform-translate-x: var(--spacing-md);

diff --git a/src/components/wt-player/wt-player.vue b/src/components/wt-player/wt-player.vue
@@ -188,8 +188,13 @@ export default {
       left: 0; // reset plyr style for video "play" button icon
     }
 
+    .plyr__progress__buffer {
+      background: var(--wt-player-audio-progress-background);
+    }
+
     .plyr__progress input,
     .plyr__volume input {
+      cursor: pointer;
 
       &::-webkit-slider-thumb {
         border: var(--wt-slider-border);