fix: changed the code blocks (JsonEditor) to look light on light theme mode

[VIDIT45AGARWAL]

What kind of change does this PR introduce?

BugFix : Fixed light theme support for JSON editor and GettingStarted components

Issue Number:

Closes #2127

Screenshots/videos:

Current View :

Fixed View :

If relevant, did you update the documentation?

No

Summary

This PR fixes light theme support for two key components:

1) JsonEditor Component:
Previously only supported dark theme styling. Now properly switches between light and dark themes with appropriate colors for text, backgrounds, borders, and syntax highlighting.

2) GettingStarted Component:
Added full light theme support with proper color contrast, theme-aware syntax highlighting, and improved UI elements.

3) Improved Test Stability:
Updated Cypress tests to use dedicated data-test attributes instead of theme-dependent CSS selectors. This prevents test failures during theme changes and makes tests more maintainable by separating styling concerns from test logic.

Key Changes:

1. Added useTheme hook to detect user's theme preference
2. Updated all color classes to include both light and dark variants (e.g., text-slate-800 dark:text-white)
3. Switched syntax highlighting between atomOneDark and atomOneLight based on theme
4. Fixed icon visibility in light mode with brightness adjustments
5. Cypress tests have been updated to use data-test attributes for reliable test selection

Does this PR introduce a breaking change?

No

Checklist

Please ensure the following tasks are completed before submitting this pull request.

• Read, understood, and followed the contributing guidelines.

[github-actions]

Hi @VIDIT45AGARWAL! Thanks a lot for your contribution!

I noticed that the following required information is missing or incomplete: completed checklist items

Please update the PR description to include this information. You can find placeholders in the PR template for these items.

Thanks a lot!

[github-actions]

built with Refined Cloudflare Pages Action

⚡ Cloudflare Pages Deployment

Name	Status	Preview	Last Commit
website	✅ Ready (View Log)	Visit Preview	e4d3ebe

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 100.00%. Comparing base (0c2d061) to head (e4d3ebe).
⚠️ Report is 6 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff            @@
##              main     #2139   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files           30        30           
  Lines          640       649    +9     
  Branches       198       204    +6     
=========================================
+ Hits           640       649    +9     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[Utkarsh-123github]

Hi @VIDIT45AGARWAL , in your PR, tests are failing, please fix that.
Thanks!

[VIDIT45AGARWAL]

Hi @Utkarsh-123github , thanks for letting me know.
I’m currently figuring out how to resolve the failing tests. Please give me some time — I’ll update the PR once it’s fixed.

[VIDIT45AGARWAL]

Hey @Utkarsh-123github , now all checks have been passed. Please review the PR whenever you have a moment.
Thank You

[VIDIT45AGARWAL]

Also @Utkarsh-123github , if you are free please re-review this PR too.