fix: background not changing in dark/light mode toggle #220 - #225
fix: background not changing in dark/light mode toggle #220#225Ashrithhn wants to merge 1 commit into
Conversation
Thanks for creating a PR for your Issue!
|
|
@Skrishna0703 please check the pr once |
|
@Skrishna0703 can you please review and merge pr i worked on my own |
| /* Light mode (default) */ | ||
| .light body, | ||
| .light .Home { | ||
| background-color: #ffffff !important; |
There was a problem hiding this comment.
Avoid excessive !important usage to prevent future styling conflicts and allow component-level text color overrides
| /* =============================== | ||
| Global Light/Dark Background | ||
| =============================== */ | ||
|
|
There was a problem hiding this comment.
Centralizes background and text color transitions to avoid duplication and keep theme switching smooth and consistent
| @@ -19,20 +19,21 @@ export const Home = () => { | |||
| const token = localStorage.getItem("token"); | |||
|
|
|||
There was a problem hiding this comment.
Ensures API request is made only when a valid token exists, preventing unnecessary or unauthorized backend calls
2 participants
Closes #123
Description
This PR fixes the issue where only the text color changed when switching between Dark and Light mode, while the background remained static.
The update ensures that both text and background colors change smoothly and consistently when toggling themes.
Changes Made
Updated Home.css to include background color rules for both dark and light modes.
Added proper CSS variables or conditional classes for background theming.
Ensured smooth transitions between themes using CSS transitions.
Verified that the fix applies correctly across all pages wrapped by Home.jsx.
Why This Change
Improves visual consistency during theme changes.
Fixes incomplete dark/light mode behavior that affected the user experience.
Keeps theme switching smooth and modern-looking.
Testing Steps
Toggle between Dark and Light modes.
Verify that both text and background colors update correctly.
Confirm that transitions are smooth and no flickering occurs.
Type of Change
[x] Bug Fix
[ ] Enhancement
[ ] New Feature
Checklist
[x] Verified background and text colors change as expected
[x] Tested across multiple components using the Home layout
[x] No new console errors introduced
Screenshots (if Aplicable)
WhatsApp.Video.2025-10-09.at.13.04.35_3f066a17.mp4