input-password

input-password.js

export const showPassword = (btn) => {
  const input = btn.parentElement.querySelector('input');

  if (btn.classList.contains('show')) {
    btn.classList.remove('show');
    input.type = 'password';
  } else {
    btn.classList.add('show');
    input.type = 'text';
  }
};

/*
<label className="profile__label-wrap profile__text-field">
  <input type="password" name="password" placeholder="Не заполнено" required>
    <button className="show-password" type="button">
      {{macro.svg('password-eye', 30, 30)}}
    </button>
</label>

.show-password {
  position: absolute;
  top: 0;
  right: 0;
  transition-property: fill, stroke;
  transition-duration: $delay-default;
  fill: $color-default-black;
  stroke: $color-default-white;

  svg {
    width: 30px;
    height: 30px;
  }

&.show {
    fill: transparent;
    stroke: transparent;
  }
}*/