Dynamic Weather Themes
10 min read
Handle Day and Night Conditions
Task
Use the API icon suffix to distinguish daytime and nighttime clear weather.
File / section
src/App.jsx and src/utils/weather.js
Change
Keep weather.weather[0].icon?.endsWith("n") as the night check. In themeForWeather, return "night" when id === 800 && night; otherwise clear weather returns "clear".
Why this change matters
OpenWeather icon codes include day/night variants. The project uses that signal for the night theme and moon icon.
Test it
Test a nighttime clear response or temporarily log the icon code to verify the branch.
Checkpoint
Clear night conditions can activate the night theme instead of the daytime clear theme.