Fix/team builder input fields

[insanekrishnna]

Addressed Issues:

Fixes #466

Changes:

Updated the Team Builder input fields to improve visibility in High Contrast Theme.

Added visible borders to the Join by Team Code and Create New Team input fields.
Updated the Team Size label to remain clearly visible in High Contrast mode.
Reused the existing theme-aware styling without affecting the Light or Dark themes.

Testing:
Verified input borders in Light Theme.
Verified input borders in Dark Theme.
Verified input borders in High Contrast Theme.
Verified Team Size label visibility across themes.
Confirmed no unrelated files were modified.

Screenshots/Recordings:

Before
All Three Themes
High Contrast Theme :

Dark Theme :

Light :

After
All Three Themes
High Contrast

Dark

Light

Summary by CodeRabbit

• Style
  • Improved theme-aware border colors across authentication inputs, buttons, and mode toggles.
  • Updated Team Builder fields with improved contrast-mode borders.
  • Preserved readable label text in contrast mode.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Advanced

Run ID: 27204bbd-32b8-4d7f-8ae2-109659d773ec

📥 Commits

Reviewing files that changed from the base of the PR and between 2fe4053 and b7072ec.

📒 Files selected for processing (3)

• frontend/src/Pages/Authentication.tsx
• frontend/src/Pages/Authentication/forms.tsx
• frontend/src/Pages/TeamBuilder.tsx

Included review availability: Your plan provides up to 1 included review per hour; 0 remain after this review.

---

📝 Walkthrough

Walkthrough

The PR updates authentication and team builder styling with theme-aware borders and text classes. It preserves form behavior and improves control visibility in dark and high-contrast themes.

Changes

Theme-aware control styling

Layer / File(s)	Summary
Authentication control styling frontend/src/Pages/Authentication.tsx, frontend/src/Pages/Authentication/forms.tsx	Authentication toggles, inputs, messages, and buttons now use theme-aware border and text classes.
Team builder contrast styling frontend/src/Pages/TeamBuilder.tsx	Team code and team name inputs now have contrast-mode borders. The team-size label now uses white text in dark and contrast modes.

Estimated code review effort: 2 (Simple) | ~10 minutes

Severity of issue fixed: Medium

Merge Risk: ⚪ Minimal · up to b7072

This styling-only update improves control visibility across themes without changing authentication or team-building behavior, so it is ready to merge.

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Out of Scope Changes check	⚠️ Warning	The authentication styling changes in Authentication.tsx and forms.tsx are unrelated to issue #466, which covers Team Builder visibility.	Remove the unrelated authentication styling changes, or link them to a separate issue with corresponding scope.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title identifies the Team Builder input-field fix and matches the primary change.
Linked Issues check	✅ Passed	The TeamBuilder changes satisfy issue #466 by adding theme-aware borders to both input fields and preserving Team Size label visibility in High Contrast and Dark themes.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff. Analyzed 0 functions across 3…

• Fix all pre-merge checks with AI

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}