NFT Preview Card

Hi Navadeep, great work on this challenge! 😉

Here are a few tips for improve your code:

• you don't need javascript for this effect, you can add the effect :hover creating a div that appears on hover. I used tailwind but you can still see and understand which css properties you can use to do the same. Look here -> my solution
• add main tag and wrap the card for improve the Accessibility
• add transition on the element with hover effect

Overall you did well 😁 Hope this help!

Hey Navadeep, I've looked at your solution and saw that you're doing the hover effect on the text through JavaScript, which is not a good way to do it since it's not really needed as CSS offer a selector for hovering (reference 1, reference 2) you just add the selector in your CSS for the element you want to have an effect on and that's it. No need for JavaScript. Also it's not really a good practice to change the style of an element through JavaScript if it's not really needed as you can usually do all of the stuff through CSS.

Also I've seen that you position your elements with relative and absolute positions which you shouldn't use for normal positioning, you can use flex for them (flexbox), I'm talking about this section here, it would've been much easier for you to have used flexbox there.

I noticed you also used min-width on your card which is not really a good way to do that, you should always try to position your elements inside of the card and then just give the card a padding and it would look nice.

As for JavaScript there are a lot of materials online but this is a good start.

Keep up the good work 👍