From 348db7048e7b7f594ee6f92c15302e8adf9da5de Mon Sep 17 00:00:00 2001
From: Shamim Rezaie <shamim@moodle.com>
Date: Wed, 28 Mar 2018 11:35:34 +1100
Subject: [PATCH] MDL-61020 media_videojs: Fix RTL display issues

---
 media/player/videojs/styles.css | 29 +++++++++++++++++++++++++++++
 1 file changed, 29 insertions(+)

diff --git a/media/player/videojs/styles.css b/media/player/videojs/styles.css
index c9605525c7e..060bf8da17b 100644
--- a/media/player/videojs/styles.css
+++ b/media/player/videojs/styles.css
@@ -1428,3 +1428,32 @@ video::-webkit-media-text-track-display {
 .mediaplugin_videojs video {
   min-height: 32px;
 }
+
+/* MDL-61020: VideoJS timeline progress bar should not be flipped in RTL mode. */
+
+/* Prevent the progress bar from being flipped in RTL. */
+/*rtl:ignore*/
+.video-js .vjs-progress-holder .vjs-play-progress,
+.video-js .vjs-progress-holder .vjs-load-progress,
+.video-js .vjs-progress-holder .vjs-load-progress div {
+  left: 0;
+  right: auto;
+}
+/* Keep the video scrubber button at the end of the progress bar in RTL. */
+/*rtl:ignore*/
+.video-js .vjs-play-progress:before {
+  left: auto;
+  right: -0.5em;
+}
+/* Prevent the volume slider from being flipped in RTL. */
+/*rtl:ignore*/
+.video-js .vjs-volume-level {
+  left: 0;
+  right: auto;
+}
+/* Keep the volume slider handle at the end of the volume slider in RTL. */
+/*rtl:ignore*/
+.vjs-slider-horizontal .vjs-volume-level:before {
+  left: auto;
+  right: -0.5em;
+}