added background and changed layout

web/statestiek.html

@@ -7,6 +7,12 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="css.css">
     <title>Weerstation</title>
+    <style>  html{
+        background-image: url(background.png);
+        background-repeat: no-repeat;
+        background-size: 100%;
+
+    }    </style>
 </head>
 
 <nav>
@@ -21,20 +27,28 @@
     <button onclick="connect()">Connect</button>
     <button onclick="disconnect()">Disconnect</button>
     <p id="counter"></p>
- <div id="block">
-    <div id="waardes">  
+ <div id="block" class="centerdata">
+    <div class="Datadisplay">
+     <div>  
           <h1>Tempratuur is <span id="temp"></span></h1>
+          <div id="tempGraph"></div>
+     </div>
     </div>
-    <div id="waardes">
+    <div class="Datadisplay">
+     <div>
         <h1>Luchtsvochtigheid is <span id="humid"></span></h1>
+        <div id="humidGraph"></div>
+     </div>
     </div>
-    <div id="waardes">
-    <h1>Licht is <span id="licht"></span></h1>
+
+   <div class="Datadisplay">
+     <div>
+     <h1>Licht is <span id="licht"></span></h1>
+     <div id="lightGraph"></div>
+   </div>
     </div>
+
  </div>
-    <div id="tempGraph"></div>
-    <div id="humidGraph"></div>
-    <div id="lightGraph"></div>
 
 
     <script src="js-ts/serialv2.js"> </script>