Make sure the control bar hint is centered

Fixed positioned flex boxes are not positioned correctly in Safari. Add
the normal top 50% translate -50% method.

Fixes issue #848.

diff --git a/app/styles/base.css b/app/styles/base.css
index d70c815b5510a19e96e7058108b761e22c529c3b..6e42d01b2bfa05c5092effcc7ab30a9087c87bcf 100644 (file)
--- a/app/styles/base.css
+++ b/app/styles/base.css
@@ -409,6 +409,8 @@ select:active {
   position: fixed;
   left: calc(100vw - 50px);
   right: auto;
+  top: 50%;
+  transform: translateY(-50%) scale(0);
   width: 100px;
   height: 50%;
   max-height: 600px;
@@ -420,7 +422,6 @@ select:active {
   box-shadow: 0 0 10px black, inset 0 0 10px 10px rgba(110, 132, 163, 0.8);
   border-radius: 10px;
   transition-delay: 0s;
-  transform: scale(0);
 }
 #noVNC_control_bar_anchor.noVNC_right #noVNC_control_bar_hint{
   left: auto;
@@ -430,7 +431,7 @@ select:active {
   visibility: visible;
   opacity: 1;
   transition-delay: 0.2s;
-  transform: scale(1);
+  transform: translateY(-50%) scale(1);
 }
 
 /* General button style */