From f59be0586f675394514003784b7ffffbb845cc2b Mon Sep 17 00:00:00 2001
From: Samuel Mannehed <samuel@cendio.se>
Date: Mon, 24 Oct 2022 15:29:27 +0200
Subject: [PATCH] Move control bar hint outside of the control bar

Makes it a more independent element responsible for it's own positioning
and vertical centering. This makes the hint easier to adapt for external
CSS styles and makes it possible to remote the fixed size if needed.
---
 app/styles/base.css | 16 +++++++++-------
 vnc.html            |  7 +++++--
 2 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/app/styles/base.css b/app/styles/base.css
index ac786066..af738194 100644
--- a/app/styles/base.css
+++ b/app/styles/base.css
@@ -346,11 +346,17 @@ html {
 }
 
 /* Control bar hint */
-#noVNC_control_bar_hint {
+#noVNC_hint_anchor {
   position: fixed;
-  left: calc(100vw - 50px);
+  right: -50px;
+  left: auto;
+}
+#noVNC_control_bar_anchor.noVNC_right + #noVNC_hint_anchor {
+  left: -50px;
   right: auto;
-  top: calc(50vh - 25%);
+}
+#noVNC_control_bar_hint {
+  position: relative;
   transform: scale(0);
   width: 100px;
   height: 50%;
@@ -364,10 +370,6 @@ html {
   border-radius: 10px;
   transition-delay: 0s;
 }
-#noVNC_control_bar_anchor.noVNC_right #noVNC_control_bar_hint{
-  left: auto;
-  right: calc(100vw - 50px);
-}
 #noVNC_control_bar_hint.noVNC_active {
   visibility: visible;
   opacity: 1;
diff --git a/vnc.html b/vnc.html
index 030fc18c..4993a7df 100644
--- a/vnc.html
+++ b/vnc.html
@@ -255,10 +255,13 @@
             </div>
         </div>
 
-        <div id="noVNC_control_bar_hint"></div>
-
     </div> <!-- End of noVNC_control_bar -->
 
+    <div id="noVNC_hint_anchor" class="noVNC_vcenter">
+        <div id="noVNC_control_bar_hint">
+        </div>
+    </div>
+
     <!-- Status Dialog -->
     <div id="noVNC_status"></div>