This is a solution to the NFT preview card component challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Note: Delete this note and update the table of contents based on what sections you keep.
Users should be able to:
- View the optimal layout depending on their device's screen size
- See hover states for interactive elements
- Solution URL: https://github.com/BrayanDaga/NFT-card
- Live Site URL: https://brayandaga.github.io/NFT-card
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- CSS Grid
- Mobile-first workflow
I have learned the use of the "hover" pseudo-class with the "after" pseudo-element
.mask:hover::after {
background-color: hsla(178, 100%, 50%, 50%);
...
}
- Frontend Mentor - @BrayanDaga
- Twitter - @BrayanDaga