From 9488de30e5ec5363a9fa3298c846a5ba100e4dbb Mon Sep 17 00:00:00 2001
From: Albin Larsson <mail@albinlarsson.com>
Date: Tue, 31 Jul 2018 16:17:55 +0200
Subject: [PATCH] Fix #1137: Improve captions positioning consistency

---
 src/sass/components/captions.scss |  7 ++++---
 src/sass/components/controls.scss | 13 +++++--------
 2 files changed, 9 insertions(+), 11 deletions(-)

diff --git a/src/sass/components/captions.scss b/src/sass/components/captions.scss
index 8fce581a..1cfca92e 100644
--- a/src/sass/components/captions.scss
+++ b/src/sass/components/captions.scss
@@ -17,7 +17,6 @@
     padding: $plyr-control-spacing;
     position: absolute;
     text-align: center;
-    transform: translateY(-($plyr-control-spacing * 4));
     transition: transform 0.4s ease-in-out;
     width: 100%;
 
@@ -53,6 +52,8 @@
     display: block;
 }
 
-.plyr--hide-controls .plyr__captions {
-    transform: translateY(-($plyr-control-spacing * 1.5));
+// If the lower controls are shown and not empty
+.plyr:not(.plyr--hide-controls) .plyr__controls:not(:empty) ~ .plyr__captions {
+    transform: translateY(-($plyr-control-spacing * 4));
 }
+
diff --git a/src/sass/components/controls.scss b/src/sass/components/controls.scss
index d06cb232..65b7554c 100644
--- a/src/sass/components/controls.scss
+++ b/src/sass/components/controls.scss
@@ -2,6 +2,11 @@
 // Controls
 // --------------------------------------------------------------
 
+// Hide empty controls
+.plyr__controls:empty {
+    display: none;
+}
+
 // Hide native controls
 .plyr--full-ui ::-webkit-media-controls {
     display: none;
@@ -109,11 +114,3 @@
 .plyr--fullscreen-enabled [data-plyr='fullscreen'] {
     display: inline-block;
 }
-
-.plyr__controls:empty {
-    display: none;
-    
-    ~ .plyr__captions {
-        transform: translateY(0);
-    }
-}