From 61420d03c48d67913cd85571088dd31ac88fbb5a Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Mon, 23 Aug 2021 15:03:44 -0400
Subject: cleaned up videobox controls along with option to switch to native
 controls.  changed placement of link buttons in lightbox to be outside of
 document

---
 src/client/views/nodes/VideoBox.scss | 67 +++++++++---------------------------
 1 file changed, 16 insertions(+), 51 deletions(-)

(limited to 'src/client/views/nodes/VideoBox.scss')

diff --git a/src/client/views/nodes/VideoBox.scss b/src/client/views/nodes/VideoBox.scss
index f593f74fb..cdd36eb3b 100644
--- a/src/client/views/nodes/VideoBox.scss
+++ b/src/client/views/nodes/VideoBox.scss
@@ -49,63 +49,28 @@
 //     pointer-events: all;
 // }
 
-.videoBox-time{
-    color : white;
-    top :25px;
-    left : 25px;
+.videoBox-ui {
     position: absolute;
-    background-color: rgba(50, 50, 50, 0.2);
-    transform-origin: left top;
-    pointer-events:all;
+    flex-direction: row;
+    right: 5px;
+    top: 5px;
+    display: none;
+    background-color: rgba(0, 0, 0, 0.6);
 }
-.videoBox-snapshot{
+.videoBox-time, .videoBox-snapshot, .videoBox-timelineButton, .videoBox-play, .videoBox-full {
     color : white;
-    top :25px;
-    right : 25px;
-    position: absolute;
-    background-color:rgba(50, 50, 50, 0.2);
+    position: relative;
     transform-origin: left top;
     pointer-events:all;
-    cursor: default;
-}
-
-.videoBox-timelineButton {
-    position: absolute;
-    display: flex;
-    align-items: center;
-    z-index: 1010;
-    bottom: 5px;
-    right: 5px;
-    color: white;
+    padding-right: 5px;
     cursor: pointer;
-    background: dimgrey;
-    width: 20px;
-    height: 20px;
-}
-.videoBox-play {
-    width: 25px;
-    height: 20px;
-    bottom: 25px;
-    left : 25px;
-    position: absolute;
-    color : white;
-    background-color: rgba(50, 50, 50, 0.2);
-    border-radius: 4px;
-    text-align: center;
-    transform-origin: left bottom;
-    pointer-events:all;
+    &:hover {
+        background-color: gray;
+    }
 }
-.videoBox-full {
-    width: 25px;
-    height: 20px;
-    bottom: 25px;
-    right : 25px;
-    position: absolute;
-    color : white;
-    background-color: rgba(50, 50, 50, 0.2);
-    border-radius: 4px;
-    text-align: center;
-    transform-origin: right bottom;
-    pointer-events:all;
 
+.videoBox:hover {
+    .videoBox-ui {
+        display: flex;
+    }
 }
\ No newline at end of file
-- 
cgit v1.2.3-70-g09d2