diff --git a/web/newWebsite/main.js b/web/newWebsite/main.js index c5e1486..72d3a01 100644 --- a/web/newWebsite/main.js +++ b/web/newWebsite/main.js @@ -141,4 +141,4 @@ function toggleGraph(nodeId) { } else { console.error('No element found with id: liveGraph' + nodeId); } -} \ No newline at end of file +} diff --git a/web/newWebsite/styles/dashboard-styles.css b/web/newWebsite/styles/dashboard-styles.css index 34efb9b..eeab2b1 100644 --- a/web/newWebsite/styles/dashboard-styles.css +++ b/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; - } - \ No newline at end of file + justify-content: center; + display: flex; +} + +.js-plotly-plot { + width: 90%; + height: 100%; +} + +.disabled { + opacity: 0; + height: 0; + +}