Succbone HMI Updates #10

Merged
q3k merged 4 commits from succd-style into main 2024-10-05 17:37:12 +00:00
Showing only changes of commit 4f74e92c45 - Show all commits

View file

@ -52,12 +52,20 @@ td > span {
height: 10em; height: 10em;
} }
.graph-container {
background-color: #e8e8e8;
text-align: center;
}
.main-grid { .main-grid {
margin: 2em; margin-top: 2em;
margin-left: auto;
margin-right: auto;
max-width: 160em;
clear: both; clear: both;
display: grid; display: grid;
grid-template-columns: repeat(auto-fit, minmax(50em, 1fr)); grid-template-columns: repeat(auto-fit, minmax(54em, 1fr));
column-gap: 2em; column-gap: 2em;
row-gap: 2em; row-gap: 2em;
} }
@ -136,9 +144,9 @@ td > span {
</tr> </tr>
</table> </table>
<p> <div class="graph-container">
<canvas id="graph" width="1024" height="512" style="max-width: 100%;"></canvas> <canvas id="graph" width="1024" height="512" style="max-width: 100%;"></canvas>
</p> </div>
</div> </div>
<p style="font-style: italic; font-size: 12px; margin-top: 5em;"> <p style="font-style: italic; font-size: 12px; margin-top: 5em;">
@ -170,7 +178,7 @@ let historicalDraw = (w, h) => {
// coordinate calculation. // coordinate calculation.
canvas.clearRect(0, 0, w, h); canvas.clearRect(0, 0, w, h);
canvas.fillStyle = "#f0f0f0"; canvas.fillStyle = "#e8e8e8";
canvas.fillRect(0, 0, w, h); canvas.fillRect(0, 0, w, h);
// Margins of the main graph window. // Margins of the main graph window.