Skip to content
  • Unlock Pro
  • Log in with GitHub
Solution
Submitted about 1 year ago

Responsive product preview card using sass

sass/scss
nodegreecode•430
@nodegreecode
A solution to the Product preview card component challenge
View live sitePreview (opens in new tab)View codeCode (opens in new tab)

Solution retrospective


What are you most proud of, and what would you do differently next time?

I am happy to finish this challenge, which took me so long actually because of moving to a new apartment. I am proud to implement not only Sass but build the component based on 7-1 file system architecture, which was pretty challenging as there were several updates in the Sass preprocessor and also BEM methodology in order to organize my classes/elements.

What challenges did you encounter, and how did you overcome them?

I'v spent a lot of time figuring out how the "jumping" image inside flexbox container can be fixed. At the end, I'v added a couple of media queries, and it works.

What specific areas of your project would you like help with?

I can help with implementing new Sass features like @use and building parametrized mixins.

Code
Loading...

Please log in to post a comment

Log in with GitHub

Community feedback

No feedback yet. Be the first to give feedback on nodegreecode's solution.

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner
  • Use cases

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License