AOSSIE-Org / AOSSIE-Org/DebateAI
[BUG]: Reset Password form inputs have no visible border in High Contrast theme
- Ngôn ngữ chính
- TypeScript
- Star
- 84
- Fork
- 198
- Merge trung bình
- 2 ngày 19 giờ
- Pull request đã merge (30 ngày)
- 30
Mô tả
### Bug Description
On the "Reset Your Password" form (`/auth` → Forgot Password → after entering email → the code/new-password step), the three input fields — **Enter Code**, **New Password**, **Confirm New Password** — have no visible border in the High Contrast theme. They appear as floating placeholder text with no boxes.
This is the same class of issue as #458 (Sign In inputs, fixed in #459), but on the **Reset Your Password** form, which #459 did not cover. Verified visually: the Sign In, Sign Up, and Forgot Password (email) inputs all render borders correctly in High Contrast — only the Reset Your Password step's inputs are affected.
**Root cause** — in `frontend/src/Pages/Authentication/forms.tsx` (`ResetPasswordForm`), the new-password and confirm-password inputs use only `dark:border-white`, which applies a border only in Dark theme, with no High Contrast variant:
- New Password (line ~374): `className="w-full mb-2 dark:border-white"`
- Confirm New Password (line ~381): `className="w-full mb-4 dark:border-white"`
(The Enter Code input at ~367 has a base `border` but still reads borderless in HC — worth aligning all three.)
**Fix:** add a High Contrast border variant consistent with the pattern used elsewhere, e.g. `border [.contrast_&]:border-white`, matching how #459 handled the Sign In inputs.
@Ri1tik I found this while working on #485 (reset-code expiry). I've verified all the auth screens in High Contrast — Sign In, Sign Up, and Forgot Password inputs render borders fine; only the Reset Your Password form is affected. Could you assign this to me? Happy to fix it alongside the reset-password work.
### Steps to Reproduce
1. Go to `/auth` and switch the theme to High Contrast.
2. Click "Forgot your password? Reset Password", enter an email, submit.
3. On the "Reset Your Password" step, observe the Enter Code / New Password / Confirm New Password inputs have no visible borders — just floating text.
### Logs and Screenshots
frontend/src/Pages/Authentication/forms.tsx (ResetPasswordForm):
// code (has base border)
// new password (no HC/base border)
// confirm password (no HC/base border)
### Environment Details
- File: frontend/src/Pages/Authentication/forms.tsx (ResetPasswordForm inputs)
- Page: /auth → Reset Your Password step
- Frontend: Vite + React + Tailwind
- Branch: main
- Related: #458 / #459 (same class, Sign In) — verified this is the only remaining affected form; Sign In, Sign Up, and Forgot Password inputs render borders correctly in HC
### Impact
Low - Minor inconvenience
### Code of Conduct
- [x] I have joined the [Discord server](https://discord.gg/hjUhu33uAn) and will post updates there
- [x] I have searched existing issues to avoid duplicates
Hướng dẫn đóng góp
Chưa lập chỉ mục được hướng dẫn đóng góp cho kho mã nguồn này
Đánh giá
Issue này chưa được đánh giá.