Merge branch 'main' into realTimeVisulization

app/src/styles/pages/realTimeViz.scss

@@ -32,7 +32,7 @@
     min-width: 250px;
     max-width: 300px;
 
-    min-height: 83px !important;
+    // min-height: 83px !important;
     // max-height: 100px !important;
 
     background: var(--background-color);
@@ -362,7 +362,7 @@
 
   .panel.hidePanel {
     pointer-events: none;
-    opacity: 0.1;
+    opacity: 0;
   }
 }
 
@@ -769,20 +769,19 @@
 
 .editWidgetOptions {
   position: absolute;
-  // top: 50%;
-  // left: 50%;
-  // transform: translate(-50%, -50%);
   background-color: var(--background-color);
   z-index: 3;
   display: flex;
   flex-direction: column;
   border-radius: 6px;
   overflow: hidden;
+  padding: 4px;
 
   min-width: 150px;
 
   .option {
-    padding: 8px 10px;
+    padding: 4px 10px;
+    border-radius: #{$border-radius-small};
     color: var(--text-color);
     cursor: pointer;
 
@@ -795,7 +794,8 @@
       color: #f65648;
 
       &:hover {
-        background-color: #ffe3e0;
+        background-color: #f65648;
+        color: white;
       }
     }
   }