Skip to content

✨Enhancement: Adapt "How it works" text color for Light Mode theme (#73)#90

Open
nitishchaubeyy wants to merge 1 commit into
indresh404:mainfrom
nitishchaubeyy:fix/how-it-works-light-mode
Open

✨Enhancement: Adapt "How it works" text color for Light Mode theme (#73)#90
nitishchaubeyy wants to merge 1 commit into
indresh404:mainfrom
nitishchaubeyy:fix/how-it-works-light-mode

Conversation

@nitishchaubeyy
Copy link
Copy Markdown
Contributor

Description

Resolves #73

This PR fixes the text contrast and background issues within the "How it Works" modal when the application is toggled to Light Mode.

🚀 Changes Made:

  • Added dynamic Tailwind classes (dark:) to the modal's background, borders, and text elements (e.g., changing hardcoded bg-slate-900 to bg-white dark:bg-slate-900).
  • Adjusted the gradient text of the main title to use deeper, higher-contrast colors in Light Mode (from-violet-600) while maintaining the original vibrant colors (dark:from-violet-400) in Dark Mode.
  • Ensured step descriptions and titles dynamically switch from text-slate-600 in Light Mode to text-white/slate-400 in Dark Mode for optimal readability.

🧪 Testing Done:

  • Verified that opening the modal in Light Mode displays correct backgrounds and legible text.
  • Verified that toggling to Dark Mode retains the original dark styling flawlessly.

@vercel
Copy link
Copy Markdown

vercel Bot commented May 30, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
ranker-hub Ready Ready Preview, Comment May 30, 2026 9:35pm

@github-actions github-actions Bot added bug Something isn't working enhancement New feature or request frontend Frontend related changes (HTML/CSS/JS/React) gssoc GirlScript Summer of Code gssoc26 GirlScript Summer of Code 2026 nsoc NSoC NSoC'26 NSoC 2026 pending-review PR is pending review labels May 30, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

bug Something isn't working enhancement New feature or request frontend Frontend related changes (HTML/CSS/JS/React) gssoc GirlScript Summer of Code gssoc26 GirlScript Summer of Code 2026 nsoc NSoC NSoC'26 NSoC 2026 pending-review PR is pending review

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Enhancement] Adapt "How it works" text color for Light Mode theme

1 participant