Fix blank GitHub sign-in page UI and improve auth layout

[tharunika-19]

Related Issue

Closes #606

Changes Made

• Added a custom NextAuth sign-in page
• Added DevTrack branding and tagline
• Improved GitHub sign-in button visibility and styling
• Replaced the default blank auth screen with a responsive centered auth card
• Improved overall UI/UX of the authentication flow

Before

• Blank dark screen with only a floating GitHub button
• Poor icon/button contrast
• No branding or visual hierarchy

After

• Fully styled and branded authentication page
• Better spacing, contrast, and responsiveness
• Improved user experience and accessibility

Screenshots

Before :

After:

[vercel]

@tharunika-19 is attempting to deploy a commit to the PRIYANSHU DOSHI's projects Team on Vercel.

A member of the Team first needs to authorize it.

[github-actions]

GSSoC Label Checklist 🏷️

@Priyanshu-byte-coder — please apply the appropriate labels before merging:

Difficulty (pick one):

• level:beginner — 20 pts
• level:intermediate — 35 pts
• level:advanced — 55 pts
• level:critical — 80 pts

Quality (optional):

• quality:clean — ×1.2 multiplier
• quality:exceptional — ×1.5 multiplier

Validation (required to score):

• gssoc:approved — counts for points
• gssoc:invalid / gssoc:spam / gssoc:ai-slop — does not score

Type labels (type:*) are auto-detected from files and title. Review and adjust if needed.
Points formula: (difficulty × quality_multiplier) + type_bonus

[github-actions]

Thanks for your first PR on DevTrack! 🎉

A maintainer will review it within 48 hours. While you wait:

• Make sure CI is passing (type-check + lint)
• Double-check the PR description is filled out and the issue is linked
• Feel free to ask questions in Discussions if you need help

If you find DevTrack useful, a ⭐ star on the repo is always appreciated — it helps the project grow and attract more contributors!

[Priyanshu-byte-coder]

Two issues:

1. Missing EOF newline
2. Hardcoded colors — the sign-in page uses hardcoded values:
   • bg-[#0b1120] → bg-[var(--background)]
   • border-white/10, bg-white/5 → border-[var(--border)], bg-[var(--card-muted)]
   • text-white → text-[var(--foreground)]
   • text-gray-400 → text-[var(--muted-foreground)]
   • bg-white text-black (GitHub button) — the GitHub sign-in button can keep a neutral style, but use bg-[var(--background)] text-[var(--foreground)] to respect theme

[tharunika-19]

Thanks for the review! 🚀

I’ve updated the sign-in page to use theme variables instead of hardcoded colors, added the missing EOF newline, and improved the button hover interaction as well.

[tharunika-19]

Hi @Priyanshu-byte-coder

Thanks for the review! 🚀
I’ve updated the sign-in page to use theme variables instead of hardcoded colors, added the missing EOF newline, and improved the button hover interaction as well.

[Priyanshu-byte-coder]

The /auth/signin/page.tsx now uses correct CSS vars — good. Blocker: PRBreakdownChart.tsx in this PR's diff still has hardcoded hex (backgroundColor: "#111827", border: "1px solid #374151", color: "#ffffff"). Replace with CSS vars: getCSSVariable('--card'), getCSSVariable('--border'), getCSSVariable('--foreground').

[tharunika-19]

Hi @Priyanshu-byte-coder 👋
Updated PRBreakdownChart.tsx to replace the remaining hardcoded tooltip colors with theme CSS variables:

• --card
• --border
• --foreground

This should now properly support the existing dark/light mode system. 🚀

[Priyanshu-byte-coder]

This PR has merge conflicts with current main. Please rebase on main to resolve before requesting review again.

[tharunika-19]

Subject: Fixed ESLint, TypeScript, and Build Errors - Ready for Review
Hi @Priyanshu-byte-coder,

Thank you for your patience! I've successfully resolved all the build errors in the fix-pr-tooltip-contrast branch. Here's a summary of the changes made:

Issues Fixed:
Footer.tsx - Updated external links with rel="noopener noreferrer" for security compliance

Fixed all anchor tags in the Community and Contact sections
This resolves the ESLint react/jsx-no-target-blank warning
BadgeSection.tsx - Replaced tags with Next.js component

Optimized images for better LCP and bandwidth usage
Removed ESLint disable comments
src/app/api/metrics/contributions/route.ts - Fixed TypeScript type error

Added missing sources: a.sources property to the merge callback
Ensures ContributionResponse type compatibility
src/lib/metrics-cache.ts - Completed cache configuration

Added missing cache endpoints: issues, discussions, coding-activity-insights, inactive-repos, streak_freeze
Removed duplicate type declarations
Type system now correctly validates all metric cache keys
Build Status: All checks passing

ESLint: No warnings or errors
TypeScript: Type checking passed
Build: Successfully compiled
The branch is now ready for review and testing. All GitHub Actions CI should pass.

Thank you again !