Rest countries API with colour theme switcher master Solution

Good job, I working on this one as well. Take a look at the following points:

• In my opinion the more interactive a UI is the better and therefor as frontend dev you should use at every at you disposal where it makes sence for example for simple link a hover state suffices but somewhere else you might wanna spice things up with custom animation/transitions.

  1. the toggle button for the theme needs a hover state to communicate to the users it could be changed.

  2. the card representing each contry needs a hover state as well to let the user know there is more.

  3. The border contries displayed in the footer of when you click on contry

• Take a look at the issu rapport generated and correct them.

• The mode toggle button is not keybord accessible and has a too wide of a clickable area by which I mean if you click in the middle of header you can change the theme, the clickable area should be a small rectangle covering the toggle button.

• The queries that don't mapp to a real country, it should display a "no result" message to let the user know it does not exist.

Happy coding :=)

Hi Chinmay, great work on this challenge! 😉

Here are a few tips for improve your code:

• add <title> to head of document
• add header tag and wrap the navbar for improve the Accessibility
• add main tag and wrap the cards for improve the Accessibility
• img element must have an alt attribute, it's very important!
• remove all unnecessary code, the less you write the better as well as being clearer: for example the div container of images of flag and html comments
• use h2 for the name country into the card
• you can use ul element instead multiple p for the text details of country
• if I type a query that doesn't give any results, nothing happens, try adding a "no results" message
• I would also add a query reset button, I find it very convenient

Overall you did well 😁 Hope this help!