WORKING

web/newWebsite/styles/dashboard-styles.css

@@ -57,7 +57,7 @@ body {
     margin-top: 8vh;
     background-color: #f0f0f0;
     flex-direction: column;
-    background-color: #afafaf;  
+    background-color: #afafaf;
     align-items: center;
 
 }
@@ -74,7 +74,7 @@ body {
     border-radius: 50px;
     border: 2px solid #333;
     clear: both;
-    margin-top: 20px;
+    margin-bottom: 10px;
     position: relative;
 }
 
@@ -108,6 +108,7 @@ body {
     text-align: center;
     position: relative;
     padding-top: 3vh; /* Increase bottom padding */
+
 }
 
 .gaugeContainer {
@@ -127,7 +128,7 @@ body {
 .gaugeImage {
     width: 100%;
     height: auto;
-    max-height: 140%;
+    max-height: 120%;
     object-fit: contain;
     position: absolute; /* Make the image position absolute */
     top: 0;
@@ -230,12 +231,17 @@ body {
     float: bottom;
     padding: 1vw;
     align-items: center;
-    align-self: center;
-    border: 3px solid #ccc;
-    border-radius: 10px;
-    margin: 20px;
-    padding: 20px;
-    width: 95%;
-    box-sizing: border-box;
-  }
-  
+    justify-content: center;
+    display: flex;
+}
+
+.js-plotly-plot {
+    width: 90%;
+    height: 100%;
+}
+
+.disabled {
+    opacity: 0;
+    height: 0;
+
+}