mode sombre + horloge

pages/css/devis.js

@@ -11,7 +11,6 @@ const txt_restant = document.getElementById("txt_restant");
 const MAX = 500;
 const formulaire = document.querySelector("form");
 console.log("dans le local : ", localStorage.getItem("nbVehicules"));
-
 const services = [
   {
     nom: "Géolocalisation",
@@ -31,6 +30,7 @@ const services = [
   },
 ];
 const corps = document.getElementById("services");
+const horloge = document.getElementById("horloge");
 let lignes = "";
 let nbVehicules;
 if (localStorage.getItem("nbVehicules") !== null) {
@@ -86,3 +86,11 @@ for (const service of services) {
   </tr>`;
 }
 corps.innerHTML = lignes;
+document.getElementById("color").addEventListener("click", function () {
+  document.body.classList.toggle("sombre");
+});
+function heure() {
+  horloge.textContent = new Date().toLocaleTimeString();
+}
+heure();
+setInterval(heure, 1000);

pages/css/style_services.css

@@ -42,6 +42,8 @@ h1 {
     position: fixed;
     bottom: 0;
     width: 100%;
+    display: flex;
+    justify-content: space-around;
 }
 #nav_barre {
     display: flex;
@@ -211,3 +213,7 @@ p {
     gap: 6px;
     line-height: normal;
 }
+body.sombre {
+    background-color: #1d2733;
+    color: white;
+}

pages/services.html

@@ -67,7 +67,9 @@
         </div>
         </div>
         <footer class="footer">
+            <button id="color">Mode sombre</button>
             stagiaires rpz echoes
+            <span id="horloge"></span>
         </footer>
         <script src="css/devis.js"></script>
     </body>