REST Countries API with color theme switcher, HTML, SCSS, JS

Community feedback

• 

  Travolgi 🍕•31,300

  @denielden

  Posted about 3 years ago

  Hi Abubkar, great work on this challenge! 😉

  Here are a few tips for improve your code:

  • add main tag and wrap all the section for improve the Accessibility
  • img element must have an alt attribute, it's very important!
  • to make all flag images the same height use the object-fit: cover properties to .section-2 .container img class
  • use ul element for the details text of country instead of multiple p
  • to make it look as close to the design as possible remove the dark hover effect to cards and button when the user is in the light mode
  • remove margin-bottom from .section-2 .container class because with flex they are superfluous and use gap: 4rem to .section-2 class
  • instead of using px use relative units of measurement like rem -> read here
  • 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
  • in the filters there is no way to return to all countries after choosing a region, add an entry "all region"

  Overall you did well 😁 Hope this help!

  11

  Marked as helpful
• 

  Luis Castillo•380

  @lipe11

  Posted about 3 years ago

  Hi,

  Regarding your question, to pass data to another page, a common approach is to send it through query parameters, they are appended to the url like this http://example.com/page.html?param=value (I'll leave a reference here).

  Most likely you would only pass the id of the country as a parameter, and do a fetch for that id on page load.

  Hope this is helpful

  11

  Marked as helpful