Skip to content

Conversation

@sathwikhbhat
Copy link
Contributor

Description

This PR fixes the issue where country flags or associated text were not visible in dark mode on the currency selection screen. The solution applies Tailwind CSS classes (text-black dark:text-white) to the relevant div, ensuring proper text colour contrast in both light and dark modes.

Related Issue

Fixes #166

Types of Changes

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Enhancement (improvement to an existing feature)
  • Breaking change (fix or feature that would cause existing functionality to change)
  • Test (adds or updates tests only)
  • Documentation (non-code change)

Checklist

  • My code follows the code style of this project
  • My change requires a change to the documentation
  • I have updated the documentation accordingly
  • I have added tests to cover my changes
  • All new and existing tests passed

Copilot AI review requested due to automatic review settings October 24, 2025 13:41
@netlify
Copy link

netlify bot commented Oct 24, 2025

Deploy Preview for paisable ready!

Name Link
🔨 Latest commit ba4c779
🔍 Latest deploy log https://app.netlify.com/projects/paisable/deploys/68fb848f1af27c0007ab29c6
😎 Deploy Preview https://deploy-preview-167--paisable.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
Lighthouse
Lighthouse
1 paths audited
Performance: 94
Accessibility: 100
Best Practices: 100
SEO: 91
PWA: 80
View the detailed breakdown and full score reports

To edit notification comments on pull requests, go to your Netlify project configuration.

Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull Request Overview

This PR addresses a dark mode visibility issue where country flags or associated text were not visible on the currency selection screen. The fix applies appropriate Tailwind CSS classes for text color contrast in both light and dark modes. Additionally, the PR introduces a new 404 Not Found page with proper dark mode support and integrates it into the application's routing.

  • Applied text-black dark:text-white classes to currency flag display for proper dark mode visibility
  • Created a new NotFound component with full dark mode compatibility
  • Added wildcard route to handle undefined paths

Reviewed Changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 1 comment.

File Description
frontend/src/pages/SetupPage.jsx Fixed dark mode visibility by adding text color classes to currency flag span
frontend/src/pages/NotFound.jsx Created new 404 page component with dark mode support and navigation options
frontend/src/App.jsx Added NotFound component import and wildcard route for unmatched paths

Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

@sathwikhbhat sathwikhbhat force-pushed the fix/dark-mode-flag-visibilty branch from b0f4c74 to ba4c779 Compare October 24, 2025 13:52
Copy link
Member

@archa8 archa8 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM!

@archa8 archa8 merged commit a35d1fd into Code-A2Z:master Oct 31, 2025
4 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Dark mode: Country flags invisible (black-on-dark) in currency selection setup

2 participants