toannt/uldp-degree-mangement-system
1
0
Fork 0
forked from UKSOURCE/cms.hailearning.edu.vn
Code Pull Requests Activity

feat: add password toggle visibility and rename forgot-password to change-password

Browse Source
This commit is contained in:
Wini_Fy
2026-02-10 10:24:35 +07:00
parent 2ddf43c139
commit 5e7de227ec
8 changed files with 116 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
views/auth/forgot-password.ejs → views/auth/change-password.ejs
View File

@@ -170,11 +170,11 @@
</div>
<div style="text-align: center; margin-bottom: 20px;">
<h4 style="color: var(--primary-color); font-weight: 600; margin-bottom: 5px;">Forgot Password</h4>
<p style="color: var(--text-color); font-size: 13px;">Enter your email to reset password</p>
<h4 style="color: var(--primary-color); font-weight: 600; margin-bottom: 5px;">Change Password</h4>
<p style="color: var(--text-color); font-size: 13px;">Enter your email to change password</p>
</div>
<form action="/auth/forgot-password" method="POST" class="login-form">
<form action="/auth/change-password" method="POST" class="login-form">
<div class="form-group" style="margin-bottom: 12px;">
<label for="email" class="form-label">Email Address</label>
<input type="email" class="form-control" id="email" name="email" required autofocus>
@@ -182,7 +182,7 @@
<div style="text-align: center; margin-top: 20px;">
<button type="submit" class="btn-shine">
Reset Password
Continue
</button>
</div>

17
views/auth/login.ejs
View File

@@ -170,12 +170,18 @@
<div class="form-group" style="margin-bottom: 12px;">
<label for="password" class="form-label">Password</label>
<input type="password" class="form-control" id="password" name="password" required
autocomplete="current-password">
<div style="position: relative;">
<input type="password" class="form-control" id="password" name="password" required
autocomplete="current-password" style="padding-right: 40px;">
<button type="button" class="password-toggle-btn" aria-label="Show password"
style="position: absolute; right: 10px; top: 50%; transform: translateY(-50%); border: none; background: none; color: #666; cursor: pointer; padding: 0; z-index: 10;">
<i class="fas fa-eye"></i>
</button>
</div>
<a href="/auth/forgot-password"
<a href="/auth/change-password"
style="display: block; text-align: right; margin-top: 8px; color: #2563eb; text-decoration: none; font-size: 13px; font-weight: 600;">
Forgot Your Password?
Change Password?
</a>
</div>
@@ -209,6 +215,9 @@
<!-- Flash Handler JS -->
<script src="/js/flash-handler.js"></script>
<!-- Password Toggle JS -->
<script src="/js/password-toggle.js"></script>
</body>
</html>

22
views/auth/register.ejs
View File

@@ -186,13 +186,26 @@
<div class="form-group" style="margin-bottom: 12px;">
<label for="password" class="form-label">Password</label>
<input type="password" class="form-control" id="password" name="password" required>
<div style="position: relative;">
<input type="password" class="form-control" id="password" name="password" required
style="padding-right: 40px;">
<button type="button" class="password-toggle-btn" aria-label="Show password"
style="position: absolute; right: 10px; top: 50%; transform: translateY(-50%); border: none; background: none; color: #666; cursor: pointer; padding: 0; z-index: 10;">
<i class="fas fa-eye"></i>
</button>
</div>
</div>
<div class="form-group" style="margin-bottom: 12px;">
<label for="confirm_password" class="form-label">Confirm Password</label>
<input type="password" class="form-control" id="confirm_password" name="confirm_password"
required>
<div style="position: relative;">
<input type="password" class="form-control" id="confirm_password"
name="confirm_password" required style="padding-right: 40px;">
<button type="button" class="password-toggle-btn" aria-label="Show password"
style="position: absolute; right: 10px; top: 50%; transform: translateY(-50%); border: none; background: none; color: #666; cursor: pointer; padding: 0; z-index: 10;">
<i class="fas fa-eye"></i>
</button>
</div>
</div>
<div style="text-align: center; margin-top: 20px;">
@@ -251,6 +264,9 @@
}
});
</script>
<!-- Password Toggle JS -->
<script src="/js/password-toggle.js"></script>
</body>
</html>

21
views/auth/reset-password.ejs
View File

@@ -176,12 +176,26 @@
<form action="/auth/reset-password/<%= token %>" method="POST" class="login-form">
<div class="form-group" style="margin-bottom: 12px;">
<label for="password" class="form-label">New Password</label>
<input type="password" class="form-control" id="password" name="password" required autofocus>
<div style="position: relative;">
<input type="password" class="form-control" id="password" name="password" required autofocus
style="padding-right: 40px;">
<button type="button" class="password-toggle-btn" aria-label="Show password"
style="position: absolute; right: 10px; top: 50%; transform: translateY(-50%); border: none; background: none; color: #666; cursor: pointer; padding: 0; z-index: 10;">
<i class="fas fa-eye"></i>
</button>
</div>
</div>
<div class="form-group" style="margin-bottom: 12px;">
<label for="confirm_password" class="form-label">Confirm New Password</label>
<input type="password" class="form-control" id="confirm_password" name="confirm_password" required>
<div style="position: relative;">
<input type="password" class="form-control" id="confirm_password" name="confirm_password" required
style="padding-right: 40px;">
<button type="button" class="password-toggle-btn" aria-label="Show password"
style="position: absolute; right: 10px; top: 50%; transform: translateY(-50%); border: none; background: none; color: #666; cursor: pointer; padding: 0; z-index: 10;">
<i class="fas fa-eye"></i>
</button>
</div>
</div>
<div style="text-align: center; margin-top: 20px;">
@@ -234,6 +248,9 @@
}
});
</script>
<!-- Password Toggle JS -->
<script src="/js/password-toggle.js"></script>
</body>
</html>

6
views/layouts/admin.ejs
View File

@@ -131,7 +131,7 @@
}
// Automatically clean up on every hide event
document.addEventListener('hidden.bs.modal', function() {
document.addEventListener('hidden.bs.modal', function () {
// Wait a tiny bit for the animation to finish
setTimeout(forceCleanupModals, 100);
});
@@ -146,11 +146,11 @@
}
}
}, 2000);
// Clean up on page load
window.addEventListener('load', forceCleanupModals);
</script>
<%- script %>
</body>
</html>
</html>