https://quatrocincoum.com.br/wp-content/themes/editora451_v2/asset…/password-toggle-visibility.js?ver=100.1.22

1document.addEventListener("DOMContentLoaded", () => {
2  const inputs = document.querySelectorAll(".js-password");
3
4  inputs.forEach(input => {
5    const label = input.closest(".s-form__label");
6
7    const button = document.createElement("button");
8    button.type = "button";
9    button.classList.add("password-toggle");
10    button.innerHTML = eyeOpen();
11    label.appendChild(button);
12
13    let revealed = false;
14
15    button.addEventListener("click", () => {
16      revealed = !revealed;
17      input.type = revealed ? "text" : "password";
18      button.innerHTML = revealed ? eyeClosed() : eyeOpen();
19      input.focus();
20    });
21  });
22
23  function eyeOpen() {
24    return `
25      <svg viewBox="0 0 24 24" aria-hidden="true">
26        <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8S1 12 1 12z"/>
27        <circle cx="12" cy="12" r="3"/>
28      </svg>
29    `;
30  }
31
32  function eyeClosed() {
33    return `
34      <svg viewBox="0 0 24 24" aria-hidden="true">
35        <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8S1 12 1 12z"/>
36        <path d="M3 3l18 18"/>
37      </svg>
38    `;
39  }
40});