Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Your session has expired please log in again.
Your session has expired please log in again.
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Responsive countries app using React App

#react#react-router
guchooo 110

@2saucy

Desktop design screenshot for the REST Countries API with color theme switcher coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
  • API
4advanced
View challenge

Design comparison


SolutionDesign

Solution retrospective


Feedback is greatly appreciated, so that I can continue to improving my skills 💕

Community feedback

@0marD

Posted

What did you find challenging? Well, I'm not an expert, but I hope to help you a bit. From what I can see, you didn't adjust the font size correctly. When hovering over the cards, they grow too much, and I think the animation is a bit long. Make sure the cards have the same size. You can use the CSS property "aspect-ratio" or manually set the width and height. The theme color change seems to take too long. I'm not sure if it's due to JavaScript or an HTML/CSS issue. In the mobile version, the images overflow, and the title next to the header is too large. Apart from that, everything looks good. Great job! Congratulations, bro.

1

@leonardo9245

Posted

I really liked your solution you did a great job, but there are some points that you could improve, some that I noticed:

  • the cards are with different sizes.
  • the header is too big for mobile screens.
  • it would be nice if you added the option to see all the countries in your filter by region, because when I change the region there is no option to see all the countries again, would have to reload the page again to see all the countries.
1

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord