@RayaneBengaoui
Posted
Hello Amir Afshar,
Congrats for completing this challenge ! 🙂
I would like to suggest :
-
Add
background-repeat: no-repeat
andbackground-size: cover
on your header to make the background fill the entire container and avoid duplication of the image. -
Add something that shows it's processing during the loading time for the user experience. On my solution I used a classic spinner, but also something else.
-
Handle invalid input. You could use a try/catch or even a Regex to filter invalid inputs and display an error message to the user.
-
On mobile view, move the Zoom in/out buttons to the bottom because it's hidden between the info container. If you are blocked, I've made it on my solution to this challenge. Also, you can read the official documentation of leaflet where they explain it.
-
Add some more padding and spacing to match better the design.
Overall, well done for the challenge and happy coding ! 😃
@Afshar07
Posted
@RayaneBengaoui Hey Rayan, Thanks for the tips <3 I'm gonna make the changes ASAP, thank you for pointing out those stuff ^_^