CSS changes for font size

front/display.js

@@ -12,13 +12,19 @@ const concatTextParts = textParts =>
 
 const jsonTextToHtml = data => <div className="text-bloc">{concatTextParts(data.text)}</div>;
 
-const jsonImageToHtml = data => <div className="image-bloc">{data.image}</div>;
+const jsonImageToHtml = data => <div className="image-bloc">
+  <img
+    src="https://people.via.ecp.fr/~bebert/chatenay.jpg"
+    alt-src={data.image}
+    style="height: 80px; margin-right: 10px; border: solid 1px #A0A0A0"
+  />
+</div>;
 
 const jsonImageTextToHtml = data => (
   <div className="image-text-bloc" style="display: flex">
     <img
-      src="https://people.via.ecp.fr/~stook/perso/ancien_public_html/stickerFlat.png"
-      style="height: 40px; margin-right: 10px"
+      src="https://people.via.ecp.fr/~bebert/toddy.jpg"
+      style="height: 80px; margin-right: 10px; border: solid 1px #A0A0A0"
     />
     <div style="width: 100%; display: flex; justify-content: space-between">
       {concatTextParts(data.text)}

front/index.html

@@ -15,6 +15,9 @@
 
   <div id="panel_data"></div>
 
+  <style type="text/css" id="root">
+  </style>
+
   <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.4/socket.io.slim.js"></script>
   <script type="text/javascript" src="./setup.js" defer></script>
   <script type="text/javascript" src="./socket.js" defer></script>

front/socket.js

@@ -18,11 +18,13 @@ socketIO.on('date', (data) => {
 
 socketIO.on('panel_data', (data) => {
   console.log(data);
+  // data.ttl = 500000;
   setTimeout(() => {
     socketIO.emit('panel_data');
     console.log(`Next call in ${data.ttl} milliseconds.`);
   }, data.ttl);
   const panelData = document.getElementById('panel_data');
+  document.getElementById('root').innerHTML = 'html {--size: 80px;}';
   diffNodes(panelData, jsonToHtmlArray(data));
 });
 

front/style.css

 .text-element {
-  font-size: 40px;
+  font-size: var(--size);
 }
 
 .text-bloc {