json + navbarre update

pages/css/devis.js

@@ -101,7 +101,7 @@ function heure() {
     const message = document.getElementById("message_flotte");
     const corps = document.getElementById("corps_flotte");
     try {
-      const reponse = await fetch("vehicules.json");
+      const reponse = await fetch("css/vehicules.json");
       const vehicules = await reponse.json();
       for (const v of vehicules) {
         const tr = document.createElement("tr");
@@ -116,3 +116,15 @@ function heure() {
   }
   Flotte();
 }
+function creerNavbar(pageActive) {
+  return `
+        <div id="nav_barre" class="shadow">
+            <h1>FleetZen</h1>
+            <div id="buttons">
+                <a href="contact.html"><button class="${pageActive === "contact" ? "x_to_x" : "styled"}">contact</button></a>
+                <a href="services.html"><button class="${pageActive === "services" ? "x_to_x" : "styled"}">services</button></a>
+                <a href="../index.html"><button class="retour btn_icone"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-undo2-icon lucide-undo-2"><path d="M9 14 4 9l5-5"/><path d="M4 9h10.5a5.5 5.5 0 0 1 5.5 5.5a5.5 5.5 0 0 1-5.5 5.5H11"/></svg>retour</button></a>
+            </div>
+        </div>`;
+}
+document.body.insertAdjacentHTML("afterbegin", creerNavbar("services"));

pages/css/style_services.css

@@ -189,6 +189,7 @@ p {
     border: solid;
     display: flex;
     font-size: 20px;
+    margin: 30px;
     li {
         padding: 15px;
     }
@@ -217,3 +218,24 @@ body.sombre {
     background-color: #1d2733;
     color: white;
 }
+
+.table_2 {
+    margin: 30px;
+    margin-top: 120px;
+    width: 70%;
+    height: auto;
+    background-color: lightskyblue;
+    border-collapse: collapse;
+    font-size: 20px;
+    table-layout: auto;
+    border: 2px solid;
+    th,
+    td {
+        padding: 10px;
+        text-align: center;
+    }
+
+    td {
+        background-color: lightcoral;
+    }
+}