NFT preview card component

Greetings, @Onyeka-Aribeana! 👋

Congratulations on finishing this challenge! 🎉

Yeah, when I was doing this challenge, the image overlay was the most challenging part of this challenge. Glad to know that you're finally able to find the solution. 😀

I have some feedback on this solution:

• Accessibility
  • Well done on using main landmark! 👍
  • Use interactive elements (a) for any elements that have :hover or :active states.
  • For the equilibrium image, add alternative text that says View equilibrium. The alternative text of it should work as the label or text content of the link element.
  • Good job on taking care of those decorative images! 👏
  • Use CSS border property to create the line. hr element has a role as a separator. In this case, the content below the line should not be separated.
  • Use rem or sometimes em unit instead of px. Using px will not allow the users to control the size of the page based on their needs.
• Styling
  • Don't limit the height of the body element, it will not allow the users to scroll the page if the page content needs more height. Use min-height instead.

That's it! Happy coding! 😁