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.
This was my first challenge to make on Frontend Mentor and represented a product preview card for a perfume for two resolutions (desktop and mobile devices). For my project implementation I've used Next.js framweork and Netlify to publish it online (https://fantastic-daifuku-163de3.netlify.app).
Users should be able to:
- View the optimal layout depending on their device's screen size
- See hover and focus states for interactive elements (Add to cart button, which change it's color when the user hovers over it).
- Solution URL: Github URL
- Live Site URL: Netlify homepage
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- CSS Grid
- Mobile-first workflow
- Next.js
- Bootstrap
- Sass
- Frontend Mentor - @PaulaDuduta
- GitHub - @PaulaDuduta