recherche avancement css

index.html

@@ -4,7 +4,6 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="index.css">
-    <link rel="stylesheet" href="recherche.css">
     <script src="test.js"></script>
     <script defer src="https://use.fontawesome.com/releases/v5.14.0/js/all.js"></script>
     <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
@@ -32,7 +31,7 @@
         </div>
         
     </header>
-
+    <img src="images/noresult.png" alt="noresult" class="noresult">
 
 </body>
 </html>
\ No newline at end of file

recherche.css

-#projet{
+#projets{
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
-    justify-content: space-around;
 }
 
 
 .recherche{
-    flex-basis: auto;
-    height: 200px;
-    width: 200px;
-    background: rgb(31, 216, 6);
+    height: 190px;
+    width: 190px;
+    background: #d80669ff;
+    margin-left: 20px;
+    margin-top: 10px;
+    border: 3px solid #d80669ff;
+}
+
+.noresult{
+    height: 150px;
+    width: 190px;
 }
-.searchResultButton{
-    flex-basis: auto;
+
+.nomProjet{
+    text-align: center;
+    color: white;
+    font-family: Arial, Helvetica, sans-serif;
+    font-size: large;
+    font-weight: bolder;
+}
+
+.recherche:hover{
     height: 200px;
-    margin-top: 13px;
-    margin-bottom: 13px;
-    margin-right: 13px;
+    width: 200px;
+    cursor: pointer;
 }
\ No newline at end of file

recherche.html

@@ -4,6 +4,7 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="index.css">
+    <link rel="stylesheet" href="recherche.css">
     <script src="test.js"></script>
     <script defer src="https://use.fontawesome.com/releases/v5.14.0/js/all.js"></script>
     <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
@@ -34,7 +35,7 @@
 
     <script>rechercher(localStorage.recherche)</script>
 
-    <div id="div1"></div>
+    <div id="projets"></div>
     
 
 </body>

test.js

@@ -23,7 +23,7 @@ function chargerPageProjet(idProjet){
 
 function addRechercheResultat(nomProjet, idProjet) {
     
-    document.getElementById('div1').innerHTML +="<div class='recherche'>"+ nomProjet +"<button type='submit' class='searchResultButton' onclick='chargerPageProjet("+idProjet+")'> </div>";
+    document.getElementById('projets').innerHTML +="<div class='recherche' onclick='chargerPageProjet("+idProjet+")'>"+" <img src='images/noresult.png' alt='noresult' class='noresult'>"+"<p class='nomProjet'>nomProjet</p>"+"</div>" ;
     //changer adElement() par la méthode qui permettra de charger la page d'un projet
     
 }