Bijgewerkte versie, html <body> nog niet juiste groote!
This commit is contained in:
@@ -14,6 +14,7 @@ body {
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
font-family: "Afacad", sans-serif;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
@@ -39,6 +40,7 @@ body .mainContainer .informatie-kas-main-container {
|
||||
grid-template-columns: 5fr 7fr;
|
||||
}
|
||||
body .mainContainer .mainBorder {
|
||||
padding: 1.25rem 1.5rem;
|
||||
padding: 1rem 0;
|
||||
height: 35rem;
|
||||
border: solid 5px rgb(171, 211, 174);
|
||||
@@ -90,6 +92,7 @@ body .mainContainer .mainBorder #sectie-1 .grafiek .grafiek-innerbox {
|
||||
font-size: 1.25rem;
|
||||
padding: 0 1rem 2.5rem;
|
||||
height: 225px;
|
||||
position: relative;
|
||||
}
|
||||
body .mainContainer .mainBorder #sectie-1 .grafiek .grafiek-innerbox h2 {
|
||||
position: absolute;
|
||||
@@ -140,6 +143,7 @@ body .mainContainer .mainBorder .content .kant-links #planten td article:hover {
|
||||
}
|
||||
body .mainContainer .mainBorder .content .kant-rechts {
|
||||
grid-column: 3;
|
||||
margin-right: 2rem;
|
||||
}
|
||||
body .mainContainer .mainBorder .content .kant-rechts #metingen {
|
||||
border: solid 3px rgb(171, 211, 174);
|
||||
@@ -175,12 +179,6 @@ body .mainContainer .mainBorder .grid-column-2 .grid-2-child .parent-table {
|
||||
justify-content: space-around;
|
||||
height: 90%;
|
||||
}
|
||||
body .mainContainer .mainBorder .grid-column-2 .grid-2-child .parent-table table tr td {
|
||||
font-size: 1.05rem;
|
||||
}
|
||||
body .mainContainer .mainBorder .grid-column-2 .grid-2-child .parent-table .kas-table-1 tr td {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
body .mainContainer .mainBorder .grid-column-2 .grid-2-child .parent-table .kas-table-2 {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@@ -1 +1 @@
|
||||
{"version":3,"sources":["style.scss","style.css"],"names":[],"mappings":"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","file":"style.css"}
|
||||
{"version":3,"sources":["style.scss","style.css"],"names":[],"mappings":"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","file":"style.css"}
|
||||
@@ -51,7 +51,7 @@ body
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
// font-family: $font-text;
|
||||
font-family: $font-text;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
@@ -68,7 +68,6 @@ body
|
||||
|
||||
.goodgarden-logo
|
||||
{
|
||||
// z-index: inherit;
|
||||
position: absolute;
|
||||
width: 10vw;
|
||||
left: 50%;
|
||||
@@ -84,7 +83,7 @@ body
|
||||
|
||||
.mainBorder
|
||||
{
|
||||
// padding: 1.25rem 1.5rem;\
|
||||
padding: 1.25rem 1.5rem;
|
||||
padding: 1rem 0;
|
||||
height: 35rem;
|
||||
border: solid 5px $primary-color;
|
||||
@@ -152,7 +151,7 @@ body
|
||||
font-size: 1.25rem;
|
||||
padding: 0 1rem 2.5rem;
|
||||
height: 225px;
|
||||
// position: relative;
|
||||
position: relative;
|
||||
|
||||
h2
|
||||
{
|
||||
@@ -232,7 +231,7 @@ body
|
||||
&-rechts
|
||||
{
|
||||
grid-column: 3;
|
||||
// margin-right: 2rem;
|
||||
margin-right: 2rem;
|
||||
|
||||
#metingen
|
||||
{
|
||||
@@ -290,7 +289,7 @@ body
|
||||
{
|
||||
td
|
||||
{
|
||||
font-size: 1.05rem;
|
||||
// font-size: 1.05rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -301,7 +300,7 @@ body
|
||||
{
|
||||
td
|
||||
{
|
||||
font-size: 1.25rem;
|
||||
// font-size: 1.25rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,8 +5,7 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Document</title>
|
||||
<link rel="stylesheet" href="../src/css/style.css">
|
||||
<script src="../script/main.js" defer></script>
|
||||
<!-- <script src="../script/main.py"></script> -->
|
||||
<script src="../src/js/main.js" defer></script>
|
||||
</head>
|
||||
<body>
|
||||
<section class="mainContainer">
|
||||
@@ -72,18 +71,31 @@
|
||||
</article>
|
||||
</td>
|
||||
<td>
|
||||
<!-- <article id="modalButton" onclick="openModal()">
|
||||
<article id="modalButton" onclick="openModal()">
|
||||
<img id="toevoegen"src="images/Toevoegen.png" alt="">
|
||||
</article> -->
|
||||
</article>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<div id="myModal" class="modal">
|
||||
<!-- Modal content -->
|
||||
<span class="close">×</span>
|
||||
<form action="http://localhost:3000/submit-form" method="post">
|
||||
<!-- Form content -->
|
||||
|
||||
<input type="text" name="plant_naam" id="plantNaam">
|
||||
<label for="plantNaam">Naam van de plant</label>
|
||||
|
||||
<input type="text" name="plantensoort" id="plantensoort">
|
||||
<label for="plantensoort">Soort van de plant</label>
|
||||
|
||||
<input type="radio" name="plant_geteelt" id="aanwezig" value="true">
|
||||
<label for="aanwezig">Aanwezig</label>
|
||||
|
||||
<input type="radio" name="plant_geteelt" id="afwezig" value="false">
|
||||
<label for="afwezig">Afwezig</label>
|
||||
|
||||
<input type="submit" value="Submit">
|
||||
</form>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
<!-- White space -->
|
||||
@@ -91,28 +103,37 @@
|
||||
<p>a</p>
|
||||
</section>
|
||||
<section class="kant-rechts">
|
||||
<section id="metingen">
|
||||
<article id="main-waardes">
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
<p>Waardes</p>
|
||||
</td>
|
||||
<td>
|
||||
<p>Huidig</p>
|
||||
</td>
|
||||
<td>
|
||||
<p>24u gemiddelde</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</article>
|
||||
<div class="divider">
|
||||
</div>
|
||||
<article>
|
||||
|
||||
</article>
|
||||
</section>
|
||||
<section id="sectie-1">
|
||||
<article class="parent-algemeen-overzicht">
|
||||
<article class="algemeen-overzicht">
|
||||
<table class="table-informatie-kas">
|
||||
<tr class="tr-informatie-kas">
|
||||
<td>Dagen tot Oogst</td>
|
||||
<td>12</td>
|
||||
</tr>
|
||||
<tr class="tr-informatie-kas">
|
||||
<td>Dagen in Kas</td>
|
||||
<td>2</td>
|
||||
</tr>
|
||||
<tr class="tr-informatie-kas">
|
||||
<td>Tevredenheid</td>
|
||||
<td>80%</td>
|
||||
</tr>
|
||||
<tr class="tr-informatie-kas">
|
||||
<td>Aandachtspunten</td>
|
||||
<td>1</td>
|
||||
</tr>
|
||||
</table>
|
||||
</article>
|
||||
</article>
|
||||
<article class="grafiek">
|
||||
<article class="grafiek-innerbox">
|
||||
<h2>Zonlicht</h2>
|
||||
<canvas
|
||||
id="myCanvas" class="canvas-informatie-kas" width="275" height="275"></canvas>
|
||||
</article>
|
||||
</article>
|
||||
</section>
|
||||
</section>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
@@ -2,8 +2,6 @@ const { ipcRenderer } = require("electron");
|
||||
|
||||
document.addEventListener('DOMContentLoaded', () =>
|
||||
{
|
||||
// Stuur een bericht naar de main process om het Python script uit te voeren
|
||||
// In je renderer.js (geladen met defer in je HTML)
|
||||
ipcRenderer.send('request-update-temp', ['some', 'arguments']);
|
||||
|
||||
ipcRenderer.on('update-temp-result', (event, newTemperature) => {
|
||||
@@ -16,11 +14,6 @@ document.addEventListener('DOMContentLoaded', () =>
|
||||
|
||||
});
|
||||
|
||||
// function dataTablePython()
|
||||
// {
|
||||
// document.getElementById("")
|
||||
// }
|
||||
|
||||
function openModal()
|
||||
{
|
||||
const modal = document.getElementById("myModal");
|
||||
@@ -58,19 +51,17 @@ function drawLineChart()
|
||||
const data = [20, 50, 60, 45, 50, 100, 70, 60, 65, 0, 85, 0];
|
||||
const xLabels = ["", "", "", "", "", 6, "", "", "", "", "", 12];
|
||||
|
||||
// Define Y-axis labels here. The number of labels should match your scale.
|
||||
const yLabels = ["", 20, "", 40, "", 60, "", 80, "", 100]; /*NIET VERANDEREN!!!*/
|
||||
|
||||
const canvas = document.getElementById("myCanvas");
|
||||
const ctx = canvas.getContext("2d");
|
||||
|
||||
ctx.clearRect(0, 0, canvas.width, canvas.height); // Clear the canvas
|
||||
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
||||
|
||||
const padding = 35; // Increased padding for Y labels
|
||||
const graphWidth = canvas.width - padding * 2;
|
||||
const graphHeight = canvas.height - padding * 2;
|
||||
|
||||
// Draw the axes
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(padding, padding);
|
||||
ctx.lineTo(padding, canvas.height - padding);
|
||||
@@ -78,10 +69,10 @@ function drawLineChart()
|
||||
ctx.stroke();
|
||||
|
||||
// Set the color of the line
|
||||
ctx.strokeStyle = "#008000"; // This sets the line color to green
|
||||
ctx.strokeStyle = "rgb(143, 188, 143)";
|
||||
|
||||
const xIncrement = graphWidth / (xLabels.length - 1);
|
||||
const yIncrement = graphHeight / (yLabels.length - 1); // Assuming you have labels for each increment
|
||||
const yIncrement = graphHeight / (yLabels.length - 1);
|
||||
|
||||
// Plot the data
|
||||
ctx.beginPath();
|
||||
@@ -93,7 +84,7 @@ function drawLineChart()
|
||||
const yPos = canvas.height - padding - (data[i] / 100) * graphHeight;
|
||||
ctx.lineTo(xPos, yPos);
|
||||
}
|
||||
ctx.stroke(); // Apply the stroke to the line
|
||||
ctx.stroke();
|
||||
|
||||
// Draw Y labels
|
||||
ctx.fillStyle = "black";
|
||||
|
||||
@@ -4,7 +4,6 @@
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<link rel="stylesheet" href="../src/css/style.css" />
|
||||
<!-- <script src="https://cdn.jsdelivr.net/npm/chart.js"></script> -->
|
||||
<script src="../src/js/main.js" defer></script>
|
||||
<title>Informatie Kas</title>
|
||||
</head>
|
||||
@@ -47,7 +46,6 @@
|
||||
</article>
|
||||
</article>
|
||||
</section>
|
||||
<!-- <section id="sectie-2"></section> -->
|
||||
</article>
|
||||
<article class="grid-column-2">
|
||||
<article class="grid-2-child">
|
||||
|
||||
@@ -1,7 +0,0 @@
|
||||
# In calculate.py
|
||||
|
||||
# Doe je berekeningen hier, vervang 42 door je berekende waarde
|
||||
calculated_value = 42
|
||||
|
||||
# Print het resultaat, dat zal worden gelezen door de PythonShell.run callback
|
||||
print(calculated_value)
|
||||
Reference in New Issue
Block a user