Merge branch 'master' into data-visualization-view-naafi

1 files changed, 30 insertions, 25 deletions

diff --git a/src/client/views/nodes/trails/PresBox.scss b/src/client/views/nodes/trails/PresBox.scss
index a0a2dd4f8..eb91c82f3 100644
--- a/src/client/views/nodes/trails/PresBox.scss
+++ b/src/client/views/nodes/trails/PresBox.scss
@@ -1,4 +1,4 @@
-@import "../../global/globalCssVariables";
+@import '../../global/globalCssVariables';
 
 .presBox-cont {
     cursor: auto;
@@ -12,7 +12,7 @@
     height: 100%;
     min-height: 35px;
     letter-spacing: 2px;
-    overflow: hidden;
+    //overflow: hidden;
     transition: 0.7s opacity ease;
 
     .presBox-listCont {
@@ -231,8 +231,7 @@
         margin-top: 10px;
     }
 
-    @media screen and (-webkit-min-device-pixel-ratio:0) {
-
+    @media screen and (-webkit-min-device-pixel-ratio: 0) {
         .multiThumb-slider {
             display: grid;
             background-color: $white;
@@ -289,6 +288,7 @@
             height: 10px;
             -webkit-appearance: none;
             margin-top: -1px;
+            background: transparent;
         }
 
         .toolbar-slider::-webkit-slider-thumb {
@@ -330,8 +330,6 @@
         }
     }
 
-
-
     .slider-headers {
         position: relative;
         display: grid;
@@ -354,8 +352,8 @@
 
         .slider-number {
             border-radius: 3px;
-            width: 30px;
             margin: auto;
+            overflow: hidden;
         }
     }
 
@@ -382,7 +380,6 @@
         border-bottom: solid 2px $medium-gray;
     }
 
-
     .ribbon-textInput {
         border-radius: 2px;
         height: 20px;
@@ -467,7 +464,6 @@
         font-weight: 500;
         position: relative;
 
-
         .ribbon-final-button {
             cursor: pointer;
             position: relative;
@@ -687,7 +683,6 @@
             max-width: 200px;
             overflow: visible;
 
-
             .presBox-dropdownOption {
                 cursor: pointer;
                 font-size: 11;
@@ -716,7 +711,7 @@
                 width: 85%;
                 min-width: max-content;
                 display: block;
-                background: #FFFFFF;
+                background: #ffffff;
                 border: 0.5px solid #979797;
                 box-sizing: border-box;
                 box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
@@ -741,7 +736,7 @@
     padding-top: 5px;
     padding-bottom: 5px;
     border: solid 1px $black;
-    // overflow: auto; 
+    // overflow: auto;
 
     ::-webkit-scrollbar {
         -webkit-appearance: none;
@@ -943,18 +938,21 @@
         min-width: 15px;
         max-width: 100px;
         left: 8px;
+        margin: auto;
+        margin-left: unset;
+        height: 100%;
     }
 
     .presBox-presentPanel {
         display: flex;
         justify-self: end;
         width: 100%;
-        max-width: 300px;
-        min-width: 150px;
+        margin: auto;
+        margin-right: unset;
+        height: 100%;
+        position: relative;
     }
 
-
-
     select {
         background: $dark-gray;
         color: $white;
@@ -962,7 +960,7 @@
 
     .presBox-button {
         cursor: pointer;
-        height: 25px;
+        //height: 100%;
         border-radius: 5px;
         display: none;
         justify-content: center;
@@ -993,14 +991,15 @@
         width: max-content;
         position: absolute;
         right: 10px;
+        margin: auto;
+        margin-right: unset;
+        height: 100%;
 
         .present-icon {
             margin-right: 7px;
         }
     }
 
-
-
     .collectionViewBaseChrome-viewPicker {
         min-width: 50;
         width: 5%;
@@ -1008,9 +1007,16 @@
         position: relative;
         display: inline-block;
         left: 8px;
+        margin: auto;
+        margin-left: unset;
     }
 }
 
+.presBox-buttons.inOverlay {
+    padding-top: unset;
+    padding-bottom: unset;
+}
+
 .presBox-backward,
 .presBox-forward {
     width: 25px;
@@ -1061,6 +1067,8 @@
             font-size: 30px;
             position: absolute;
             min-width: 50px;
+            margin: auto;
+            margin-left: unset;
         }
     }
 
@@ -1080,7 +1088,7 @@
     position: absolute;
     top: 0;
     left: 0;
-    opacity: 0.1;
+    opacity: 0.5;
     transition: all 0.4s;
     color: $white;
     width: 100%;
@@ -1096,13 +1104,12 @@
     color: $white;
     border-radius: 5px;
     grid-template-rows: 100%;
-    height: 25;
+    height: 100%;
     width: max-content;
     min-width: max-content;
     justify-content: space-evenly;
     align-items: center;
     display: flex;
-    position: absolute;
     transition: all 0.2s;
 
     .presPanel-button-text {
@@ -1165,8 +1172,6 @@
     .presPanel-button-text:hover {
         background-color: $medium-gray;
     }
-
-
 }
 
 // .miniPres {
@@ -1241,4 +1246,4 @@
 //             background-color: #5a5a5a;
 //         }
 //     }
-// }
\ No newline at end of file
+// }