Smikkelbakje/J1B3-Sensor-boxes
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Remove extra closing div tag in graphs.html

Browse Source
This commit is contained in:
sietse jonker
2024-03-30 21:46:32 +01:00
parent 726d411321
commit 415a0c456e
2 changed files with 163 additions and 160 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
web/newWebsite/graphs.html
View File

@@ -29,7 +29,6 @@
<body> <body>
<div id="graph1"></div> <div id="graph1"></div>
</div>
<script src="graph-classes.js"></script> <script src="graph-classes.js"></script>
<script src="graph-main.js"></script> <script src="graph-main.js"></script>
</body> </body>

88
web/newWebsite/styles/graph-styles.css
View File

@@ -13,7 +13,6 @@ body {
background-color: #f0f0f0; background-color: #f0f0f0;
flex-direction: column; flex-direction: column;
background-color: #afafaf; background-color: #afafaf;
} }
.gaugeGroup { .gaugeGroup {
@@ -62,7 +61,6 @@ body {
text-align: center; text-align: center;
position: relative; position: relative;
padding-bottom: 6vh; /* Increase bottom padding */ padding-bottom: 6vh; /* Increase bottom padding */
} }
.gaugeContainer { .gaugeContainer {
@@ -74,7 +72,6 @@ body {
height: 80%; /* Increase the height from 70% to 80% */ height: 80%; /* Increase the height from 70% to 80% */
position: relative; position: relative;
overflow: visible; overflow: visible;
} }
.gaugeImage { .gaugeImage {
@@ -90,7 +87,8 @@ body {
margin-bottom: 10px; margin-bottom: 10px;
} }
.gaugeValue, .gaugeText { .gaugeValue,
.gaugeText {
width: 100%; width: 100%;
text-align: center; text-align: center;
font-size: 24px; font-size: 24px;
@@ -104,10 +102,8 @@ body {
z-index: 2; z-index: 2;
position: absolute; position: absolute;
bottom: -3.2vw; /* Adjust this value to move the text further down */ bottom: -3.2vw; /* Adjust this value to move the text further down */
} }
.valueContainer { .valueContainer {
display: flex; display: flex;
justify-content: center; justify-content: center;
@@ -168,46 +164,54 @@ body {
} }
.container { .container {
box-sizing: border-box;
display: flex; display: flex;
flex-wrap: wrap;
flex-direction: row; flex-direction: row;
justify-content: center;
align-items: center; align-items: center;
border: 2px solid #000000; border: 2px solid #ccc;
border-radius: 10px; border-radius: 10px;
padding: 20px; padding: 20px;
}
.data-types {
flex-direction: column;
align-self: self-center;
justify-content: space-between;
padding: 20px;
width: 30%; /* Adjust width as needed */
background-color: #f1f1f1;
}
.date-filter{
align-content: center;
flex-direction: column;
justify-content: space-between;
/* width: 30%; /* Adjust width as needed */
background-color: #f1f1f1;
}
.node-filter{
align-self: center;
justify-content: space-between;
width: 10%; /* Adjust width as needed */
border: none;
border-radius: 4px;
background-color: #f1f1f1;
}
.filter-button {
width: 100%; width: 100%;
margin-top: 20px; box-sizing: border-box;
} }
/* Additional styling as needed */ .data-types {
display: flex;
flex-direction: column; /* Display data types in a column */
align-items: flex-start; /* Align to the start of the container */
text-align: right; /* Align text to the right */
width: 20%; /* Set a fixed width for the data types */
}
.filter {
display: flex;
flex-direction: column; /* Display filters in a column */
align-items: center center; /* Align to the center of the container */
text-align: center center;
margin-left: 20px; /* Add some space between the data types and filters */
}
.date-filter {
flex-direction: column;
align-items: center center;
justify-content: center;
align-self: center;
width: 30%;
}
.node-filter {
align-items: center;
text-align: center;
justify-content: center;
align-self: flex-end;
width: 20%;
}
.filter-button {
text-align: center;
align-items: center;
justify-content: center;
width: 10%;
margin-top: auto;
}
/* Additional styling as needed */