Submitted over 2 years ago

Rest countries API using HTML/CSS/JS

sivaram• 135

@s1varam

Preview site(opens in new window)View code(opens in new window)

This is a solution for...

REST Countries API with color theme switcher

HTML
CSS
JS
API

4advanced

View challenge

Design comparison

SolutionDesign

Solution retrospective

I have a few questions to the community, kindly help me in resolving them.

How to add the search icon to the input box and back icon to the back button?
Challenge says that individual country data is to be displayed in a separate page. If we display it in a separate tab, how to navigate to the current tab using back button? Right now I've shown/hidden the country grid view and details view.
How to style border countries to similar widths/heights in the grid? Thanks in advance!

Community feedback

Gerardo• 90

@JRaOr

Posted over 2 years ago

Hello,

For the input box with the search button, you can add the input and an image tag inside a div, and use css to style them, i used react icons for that. but with pure css can be acomplished. For the second point, I'm not sure how to help you with javascript vanilla, but using NextJs makes it easier and it's not that difficult. With HTML i think you could use some queries to pass the country name in the url. For the third point i used tailwindcss, makes easier style small projects and use grid. I hope it helps.

Please log in to post a comment

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