feat: added show or hide password on signup page

wajeht · Sep 20, 2022 · 6357f40 · 6357f40
1 parent e8bf122
commit 6357f40
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 3 deletions.
diff --git a/src/apps/ui/components/shared/Login.vue b/src/apps/ui/components/shared/Login.vue
@@ -166,7 +166,7 @@ export default {
 
     <!-- password -->
     <div class="mb-3">
-      <div class="d-flex gap-2 align-items-center flex-row">
+      <div class="d-flex gap-2">
         <label for="password" class="form-label me-2">Password</label>
         <div role="button" @click="showPassword = !showPassword" style="cursor: pointer">
           <i v-if="showPassword" class="bi bi-eye-slash"></i>

diff --git a/src/apps/ui/components/shared/Signup.vue b/src/apps/ui/components/shared/Signup.vue
@@ -40,10 +40,16 @@
 
     <!-- password -->
     <div class="mb-3">
-      <label for="password" class="form-label">Password</label>
+      <div class="d-flex gap-2">
+        <label for="password" class="form-label me-2">Password</label>
+        <div role="button" @click="showPassword = !showPassword" style="cursor: pointer">
+          <i v-if="showPassword" class="bi bi-eye-slash"></i>
+          <i v-else class="bi bi-eye"></i>
+        </div>
+      </div>
       <input
         v-model="password"
-        type="password"
+        :type="showPassword ? 'text' : 'password'"
         class="form-control"
         id="password"
         :disabled="loading"
@@ -149,6 +155,7 @@ export default {
       email: '',
       password: '',
       checkbox: '',
+      showPassword: false,
       loading: false,
       loginLink: '/login',
       alert: {