Form Validation Issue (Name Field Accepting Numbers) and Poor Login/Register UI Design #162
Description
Issue Title:
Form Validation Issue (Name Field Accepting Numbers) and Poor Login/Register UI Design
Description:
There are multiple issues observed in the forms and Login/Register pages that affect user experience and input validation.
- The Name field in forms is currently accepting numeric values, which should not be allowed.
- On the Login/Register pages, the back arrow icon is too small and not clearly visible.
- The overall UI design of the Login and Register pages looks outdated and inconsistent with the rest of the website’s theme.
Steps to Reproduce:
- Open any form containing the Name input field.
- Enter numeric values (e.g., “1234”) — the system accepts them.
- Go to the Login/Register page.
- Observe the back arrow and overall page design.
Expected Behavior:
- The Name field should only accept alphabetic characters and spaces (no numbers or special symbols).
- The back arrow should be clearly visible, larger in size, and follow consistent design guidelines.
- The Login and Register pages should have an improved, modern UI aligned with the website’s color theme (black and white).
Actual Behavior:
- The Name field allows users to input numbers.
- The back arrow is very small and visually unappealing.
- The Login/Register page design lacks proper alignment, spacing, and color consistency.
Impact:
- Poor form validation affects data quality and professionalism.
- Low visibility of navigation elements confuses users.
- Outdated or inconsistent design affects overall user experience and brand identity.
Severity:
Medium
Suggested Fix:
- Add input validation to restrict numbers in the Name field using HTML pattern or JavaScript (e.g.,
pattern="[A-Za-z\s]+"). - Redesign the back arrow icon to be larger and better aligned.
- Enhance Login/Register UI using consistent colors, proper spacing, and clear typography.
Screenshots
