-
Notifications
You must be signed in to change notification settings - Fork 2
Description
Expected Features:
-
Detect password strength using basic rules or a library (e.g., zxcvbn or custom logic).
-
Display visual strength indicators (e.g., progress bar or colored line).
-
Show textual feedback such as:
"Weak"
"Moderate"
"Strong"
-
Should update dynamically as the user types.
-
Responsive design compatible with both desktop and mobile layouts.
-
Code must be modular and reusable.
Suggestions for Implementation:
Use a library like zxcvbn for strength evaluation, or implement logic based on:
-
Length
-
Use of uppercase, lowercase, numbers, symbols
-
Common dictionary words
Add a component like a progress bar (div with colored background and width changes).
Color codes:
Red = Weak
Orange = Moderate
Green = Strong
Test Cases:
-
Typing "12345" shows Weak
-
Typing "Pass@123" shows Moderate
-
Typing "V#7uLxY9kP!z" shows Strong
Tech Stack:
Frontend: HTML/CSS + JavaScript or framework (React/Vue/etc.)
Files to Modify / Add:
-
Password input component file (e.g., PasswordInput.jsx, RegisterForm.vue, etc.)
-
CSS/Style file for meter appearance