Skip to content
Submitted over 1 year ago

Product preview card component (SCSS, BEM)

Super Oleksandr•320
@super-simon
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Product preview card component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Layout of the product preview card

Did it using SCSS and was trying to follow BEM.

I didn't separate the styles and images into subfolders because it doesn't make sense for such a mini project.

CSS file was also not minimized specifically for readability.

I would appreciate your feedback.

Community feedback

  • Alan Lopez Reyna•300
    @AlanLopReyPosted over 1 year ago

    EXCELLENT WORK BRO I can give you a few tips

    1. Star to use semantic tags in the HTML to improve accessibility
    2. Use the semantic tags in the HTML gives you a better way to name the classes with BEM only using the name of the tag, for example if you have a main element you can name it with the same name in the css, for small projects like this work very well

    beside that you do a excellent work

    Marked as helpful
    1
    Super Oleksandr•320
    @super-simonPosted over 1 year ago

    @AlanLopRey

    Thanks a lot for the feedback.

    Added to my TODO list to deal with semantic.

    0

Please log in to post a comment

Log in with GitHub

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