All solutions

The only thing that took me some time to solve was the view icon during the hover, i tried setting display: flex, but the icon would end up taking all the div space. It was my first time using the z-index, I hope I did it right.

This is my third challenge and by far the most difficult for me, specially because it involves deeper javascript logic. The CSS part was ok, but not easy like the other challenges I did, the most difficult part of this challenge was definitely the JS part. I tried to use Classes, but it didn't go well, so I just used a bunch of function, and it worked!

I would like to know if there's a quicker/more effective way of getting the same result, maybe using class? I don't know, my solution looked like I did too much of unnecessary work at some points, but I don't know where.

Anyway, I had a lot of fun doing this, even tho' I took like 2 days to finish it :^)

I did it both using fetch and axios (commented out the fetch code), and I'd really appreciate if someone tell me if using axios in this case is a good choice, or it doesn't matter at all.

I'm just starting in WebDev, so I found it challenging enough. I could've used fetch to import the data.json file, but I couldn't figure out what logic would I have to use to place the data. So I just hardcoded the data into the html file. The CSS part I was probably the easiest part for me, but I'd appreciate any comments/suggestions on that! The most difficult part as I mentioned was the logic behind importing the json data to the html file, I really don't know what to do after i fetched it.