bi

header.php

@@ -6,8 +6,8 @@
     </div>
     <nav>
         <ul class="nav-list">
-            <li><a id="google" class="nav-element" href="google.com">Acceuil</a></li>
+            <li><a id="google" class="nav-element" href="index.php">Acceuil</a></li>
-            <li><a id="unTest" class="nav-element" href="bing.com">Liste des recettes</a></li>
+            <li><a id="unTest" class="nav-element" href="index.php">Liste des recettes</a></li>
             <li><a id="login" class= "nav-element" href="login.php">Login</a></li>
             <li><a id="addBouton" class="nav-element" href="ajout.php">Ajouter une Recette</a></li>
             <li><a id="ingrManage" class="nav-element" href="listeIngr.php">Liste des Ingrédients</a></li>

listeIngr.js

@@ -0,0 +1,20 @@
+document.addEventListener("DOMContentLoaded", function(){
+    
+    function modifier_button_ingr(element){
+
+        let modif = element.parentElement.previousSibling.previousSibling;
+        //modif.style.color = "red";
+        console.log("click")
+    }
+
+
+
+    let modifier_button = document.getElementsByClassName("ingr-modifier");
+
+    console.log(modifier_button);
+
+    for (const element of modifier_button) {
+        element.addEventListener('click', modifier_button_ingr(element));
+    };
+
+});

listeIngr.php

@@ -17,6 +17,10 @@
                 <div class="liste-ingr-elem-text">
                     Un Element
                 </div>
+                <div class="liste-ingr-elem-modif">
+                    <a class="recette-button ingr-modifier">Modifier</a>
+                    <a class="recette-button ingr-suppr">Supprimer</a>
+                </div>
             </div>
             <div class="liste-ingr-elem">
                 <img class="ingr-image" src="pomme.jpeg">
@@ -59,4 +63,5 @@
 
     <?php include "footer.php"?>
 </body>
+<script src="listeIngr.js"></script>
 </html>

main.css

@@ -496,12 +496,23 @@ ul {
     box-shadow: 1px 1px 1px black;
 }
 
+.liste-ingr-elem:hover {
+    border:3px solid #007054;
+    box-shadow: 2px 2px 10px black;
+}
+
 .liste-ingr-elem-text {
     width: 100%;
     height: 100%;
     flex:12;
     padding-left: 20px;
     line-height: 100px;
+    color: #000000;
+}
+
+.liste-ingr-elem-modif {
+    line-height: 100px;
+    padding-right: 20px;
 }
 
 .ingr-image {
@@ -510,6 +521,11 @@ ul {
     border-radius: 10px;
 }
 
+a {
+    text-decoration: none;
+    color: black;
+}
+
 /*Footer et son contenue*/
 footer{
     padding: 25px;

main.js

@@ -80,6 +80,8 @@ document.addEventListener("DOMContentLoaded", function(){
 
     }
 
+  
+
     let ingr_form = document.getElementById("recette-form-ingr-add");
 
     ingr_form.addEventListener('submit', formulaire_ingredient_update);
@@ -89,4 +91,6 @@ document.addEventListener("DOMContentLoaded", function(){
     tag_form.addEventListener('submit', formulaire_tag_update);
 
 
+    
+
 })