Add files via upload

Vital-Vuillaume · Aug 27, 2023 · 61e70a0 · 61e70a0
1 parent a8fdb54
commit 61e70a0
Show file tree

Hide file tree

Showing 3 changed files with 38 additions and 7 deletions.
diff --git a/My-Website.css b/My-Website.css
@@ -295,10 +295,31 @@ body {
 
   font-size: 1.2em;
   color: red;
-  margin-top: 20px;
+  margin-top: 15px;
 
 }
 
+.txtRecherche {
+
+  position: relative;
+  top: 100px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 10px;
+
+}
+
+.imgRecherche {
+
+  background-image: url(recherche.png);
+  width: 100px;
+  height: 100px;
+  background-position: center;
+  background-size: cover;
+
+} 
+
 /*---------------------------
 --------Page accueil---------
 ---------------------------*/

diff --git a/My-Website.js b/My-Website.js
@@ -22,6 +22,7 @@ const btnDark = document.querySelector('.btnDark');
 const BtnEcran = document.querySelector('.btnEcran');
 const Recherche = document.querySelector('.recherche');
 const resultats = document.querySelector('.resultats');
+const txtRecherche = document.querySelector('.txtRecherche');
 
 //-----Afficher la section 1 par defaut----\\
 
@@ -141,18 +142,18 @@ const customSearches = {
 
 //-----Input qui recherche-----\\
 
-Recherche.addEventListener('input', showResults);
-
-function showResults() {
+Recherche.addEventListener('input', function() {
   const searchTerm = Recherche.value.trim().toLowerCase();
   localStorage.setItem('previousSearch', searchTerm);
 
   if (searchTerm === '') {
+    txtRecherche.style.display = 'flex';
     clearResults();
   } else {
+    txtRecherche.style.display = 'none';
     displaySearchResults(searchTerm);
   }
-}
+});
 
 function clearResults() {
   resultats.innerHTML = '';
@@ -199,7 +200,12 @@ window.addEventListener('load', function() {
   const previousSearch = localStorage.getItem('previousSearch');
   if (previousSearch) {
     Recherche.value = previousSearch;
-    showResults();
+    if (previousSearch === '') {
+      txtRecherche.style.display = 'flex';
+    } else {
+      txtRecherche.style.display = 'none';
+      displaySearchResults(previousSearch);
+    }
   }
 });
 

diff --git a/index.html b/index.html
@@ -9,7 +9,6 @@
     <link rel="icon" href="icone.ico" type="image/x-icon">
     <link rel="icon" href="icone.png" type="image/png">
     <link rel="icon" type="image/svg+xml" href="icone.svg">
-    <link rel="mask-icon" href="icone.svg" color="blue">
     <title>Vital-Website</title>
   </head>
 
@@ -33,6 +32,11 @@
       <div class="containerRecherche">
         <input class="recherche" type="text" placeholder="Rechercher un projet...">
         <div class="resultats"></div>
+        <div class="txtRecherche">
+          <div class="imgRecherche"></div>
+          <p class="hbj">Regarder tout mes projets</p>
+          <p class="hbj">Site, Collaboration, Réseau etc...</p>
+        </div>
       </div>
     </div>