From 6c5737f45678cc80a5fdc16f711ded5e5c95183c Mon Sep 17 00:00:00 2001
From: isUnknown <adrien.payet@outlook.com>
Date: Mon, 5 May 2025 17:41:43 +0200
Subject: [PATCH] front > account : add password toggle visibility

---
 src/views/Account.vue | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/views/Account.vue b/src/views/Account.vue
index 8d3f7cc..e45b9f0 100644
--- a/src/views/Account.vue
+++ b/src/views/Account.vue
@@ -32,7 +32,7 @@
     </li>
     <li :class="{ 'is-editing': isEditingEmail }">
       <input
-        type="password"
+        :type="isPasswordHidden ? 'password' : 'text'"
         v-model="password"
         id="password"
         placeholder="Minimum 8 caractères"
@@ -41,7 +41,7 @@
         required
       />
       <input
-        type="password"
+        :type="isPasswordHidden ? 'password' : 'text'"
         v-model="passwordConfirm"
         id="password-confirm"
         placeholder="Minimum 8 caractères"
@@ -49,6 +49,12 @@
         :class="{ invalid: !isPasswordConfirmed }"
         required
       />
+      <button
+        class="btn | w-full"
+        @click="isPasswordHidden = !isPasswordHidden"
+      >
+        {{ isPasswordHidden ? 'afficher' : 'masquer' }}
+      </button>
       <button
         class="btn | w-full"
         :class="'btn--' + passwordBtn.status"
@@ -118,6 +124,7 @@ const passwordBtn = ref({
   status: 'ready',
 });
 const passwordConfirm = ref('');
+const isPasswordHidden = ref(true);
 const isPasswordConfirmed = computed(() => {
   return (
     passwordConfirm.value.length > 7 && passwordConfirm.value === password.value