This is a solution to the Product preview card component challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Users should be able to:
- View the optimal layout depending on their device's screen size
- See hover and focus states for interactive elements
- Live Site: Live Site
- Semantic HTML5 markup
- Sass
- CSS Grid
- Mobile-first workflow
In this project I learned that is good to make the right decisions of what techniques you are going to use before coding the project at all. For me in particular i used grid for this one just because i thought it would be better for switching the image and the info side yet but if i thought well i would also consider using flex for that and to be honest I got a hard time with Grid since I was not that comfortable with it yet, so make the right decisions and really think before you dive into your code.