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

Community feedback

• 

  Travolgi 🍕•31,400

  @denieldenPosted over 2 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!

  Marked as helpful

  1

  ---

  

  Abubkar Ahmed•460

  @abubkar-ahmedPosted over 2 years ago

  @denielden Great tips I really appreciate it, Thanks man .

  1
• 

  Luis Castillo•380

  @lipe11Posted over 2 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

  Marked as helpful

  1

  ---

  

  Abubkar Ahmed•460

  @abubkar-ahmedPosted over 2 years ago

  @lipe11 Thanks a lot friend.

  0