Show Hide PASSWORD Update

Author: BhalliBhai

28. Show Hide Password/app.js

@@ -2,12 +2,5 @@ const input = document.querySelector("input");
 const eye = document.querySelector("#eye-icon");
 
 eye.addEventListener("click", () => {
-  //   if (input.type === "password") {
-  //     input.type = "text";
-  //   } else {
-  //     input.type = "password";
-  //   }
-
-  // REFACTOR
   input.type === "password" ? (input.type = "text") : (input.type = "password");
 });

28. Show Hide Password/index.html

@@ -17,7 +17,9 @@
     <div class="container">
       <input type="password" placeholder="Password" />
       <div class="eye-container">
-        <i class="fa fa-eye" aria-hidden="true" id="eye-icon"></i>
+        <svg width="30" height="30" class="eye-open" id="eye-icon" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+          <path fill-rule="evenodd" d="M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5ZM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5Zm-3-5c0-1.66 1.34-3 3-3s3 1.34 3 3-1.34 3-3 3-3-1.34-3-3Z" clip-rule="evenodd"></path>
+        </svg>
       </div>
     </div>