From e5e169a1e2edf53a90913b838f4c9d59c011aa12 Mon Sep 17 00:00:00 2001
From: Albin Larsson <mail@albinlarsson.com>
Date: Mon, 30 Jul 2018 01:02:13 +0200
Subject: [PATCH] Don't move caption up when "showing" the lower controls when
 the controls are empty

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

diff --git a/src/js/controls.js b/src/js/controls.js
index 2bc8b4de..e95cfc86 100644
--- a/src/js/controls.js
+++ b/src/js/controls.js
@@ -1455,12 +1455,9 @@ const controls = {
             target = this.elements.container;
         }
 
-        // Inject controls HTML
-        if (is.element(container)) {
-            target.appendChild(container);
-        } else if (container) {
-            target.insertAdjacentHTML('beforeend', container);
-        }
+        // Inject controls HTML (needs to be before captions, hence "afterbegin")
+        const insertMethod = is.element(container) ? 'insertAdjacentElement' : 'insertAdjacentHTML';
+        target[insertMethod]('afterbegin', container);
 
         // Find the elements if need be
         if (!is.element(this.elements.controls)) {
diff --git a/src/sass/components/controls.scss b/src/sass/components/controls.scss
index 4ed5b28a..91f332df 100644
--- a/src/sass/components/controls.scss
+++ b/src/sass/components/controls.scss
@@ -112,4 +112,7 @@
 
 .plyr__controls:empty {
     display: none;
-}
\ No newline at end of file
+    ~ .plyr__captions {
+        transform: translateY(0px);
+    }
+}