fixed Darkmode-Lightmode switching issue

[ashok-2003]

Description

This PR fixes #6484 (Card Text Labels Become Invisible When Switching Between Dark and Light Themes)

Notes for Reviewers

• Fixed some indentation issues.
• Added proper theme colors for the text.

Signed commits

• [x] Yes, I signed my commits.

[l5io]

🚀 Preview for commit 9892ceae2e85a84e38dc20f9f7a2e2e7c86d478a at: https://683fac9decdd6d7e89e1a9ba--layer5.netlify.app

[vr-varad]

some screen shots or recording will be helpful to review it @ashok-2003

[ashok-2003]

sure @vr-varad ,

https://github.com/user-attachments/assets/3c490f0c-6461-4fdd-a194-94f76027592b

[vr-varad]

@M-DEV-1

[LibenHailu]

If there are formatting issues, It would be nice to address them, as for the backgrounds background-color: ${(props) => props.theme.backgroundColor}; background-color: ${(props) => props.theme.grey191919ToGreyF2F5F7}; I think they are good contrasting colors for our theme, considering our theme stays consistent, LGTM!

[M-DEV-1]

If there are formatting issues, It would be nice to address them, as for the backgrounds background-color: ${(props) => props.theme.backgroundColor}; background-color: ${(props) => props.theme.grey191919ToGreyF2F5F7}; I think they are good contrasting colors for our theme, considering our theme stays consistent, LGTM!

@LibenHailu yes, I don't think that props.theme.grey191919ToGreyF2F5F7 is a default theme that we're using in our site

[LibenHailu]

If there are formatting issues, It would be nice to address them, as for the backgrounds background-color: ${(props) => props.theme.backgroundColor}; background-color: ${(props) => props.theme.grey191919ToGreyF2F5F7}; I think they are good contrasting colors for our theme, considering our theme stays consistent, LGTM!

@LibenHailu yes, I don't think that props.theme.grey191919ToGreyF2F5F7 is a default theme that we're using in our site

In the deployed version check it out it looks close.

[ashok-2003]

@LibenHailu Yeah, I later realized that a contrasting background might actually work better. Initially, I was aiming for a more blended look, but I’ll revert it back to the original for better clarity.

@M-DEV-1 Just to clarify, props.theme.grey191919ToGreyF2F5F7 is used as the main background color for that container — I took inspiration from there.

[l5io]

🚀 Preview for commit bd385c80cddaece0c4ff3a017ce73ea4a1cbd4cf at: https://68407bd8d2d571565f5b4084--layer5.netlify.app

[vishalvivekm]

@ashok-2003 will you please be reverting any formatting, white spaces as other reviews have noted as well?

[vishalvivekm]

@ashok-2003 Let's also discuss this during the website call today at 7 AM CT | 5:30 PM IST.

Add it as an agenda item to the meeting minutes, if you would :)

[l5io]

🚀 Preview for commit ec02150fd91858be3971d8c0d6113d59db5950c1 at: https://684662cf9928c8757983814e--layer5.netlify.app

[ashok-2003]

@vishalvivekm, thank you for your review. Reverting those formatting changes may likely cause issues, as discussed in the meetings. Are these the required changes, or is there anything more I’m expected to do?

[LibenHailu]

Hi @ashok-2003, as discussed on the sites meeting let's fix format issues if there are any, you can use npm run lint before committing your changes, it will fix lint issue if there are any, after that please re-request review. other than that LGTM!

[ashok-2003]

@LibenHailu, thank you for the suggestion. Unfortunately, npm run lint doesn’t work for me. After a lot of head-banging, I’ve found the main and minimal changes that are required. Are we good to go? @M-DEV-1, @vishalvivekm

[LibenHailu]

@LibenHailu, thank you for the suggestion. Unfortunately, npm run lint doesn’t work for me. After a lot of head-banging, I’ve found the main and minimal changes that are required. Are we good to go? @M-DEV-1, @vishalvivekm

@ashok-2003 Please feel free to share the error logs on slack with me if the issue persists. I am not seeing the deployment link tho.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[M-DEV-1]

@ashok-2003 @LibenHailu i suppose this is completed?

[ashok-2003]

@M-DEV-1 , Yes, I've implemented the necessary changes to resolve the issue, and I've ensured no other linting rules were modified, as discussed in the meeting.

[vr-varad]

@vishalvivekm Please Merge.

[l5io]

🚀 Preview for commit 3d072e682e8fcb70e18cc9cbba29c4e37dc45581 at: https://685e8b1887e4deb59d1bce70--layer5.netlify.app