Skip to content
Submitted 11 months ago

E-Commerce Product Page (JS/SCSS)

#accessibility#bem#sass/scss#lighthouse
Bartosz Dudziak•720
@bartoszdudziak-dev
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...E-commerce product page
  • HTML
  • CSS
  • JS
3intermediate

Design comparison

SolutionDesign

Solution retrospective

What are you most proud of, and what would you do differently next time?
  • My solution is not perfect and it was exhausting for me.
  • I am proud of I managed to create all given features. I also added some on my own.
  • I would definitely think about better structure of my code next time because I wrote in a single file and it became a bit messy.
  • I implemented basic accessibility.
What challenges did you encounter, and how did you overcome them?
  • The most problem was to create overlay. It did not work on my fixed positioned elements so I created their own overlay for each one. That solution could be better.
  • Positioning the elements took me the most time.
What specific areas of your project would you like help with?

Please give me some opinion or advice. 🫡

Community feedback

  • Achara Chisom Solomon•490
    @AcharaChisomSolomonPosted 10 months ago

    Heyyy @bartoszdudziak-dev,

    Great Job on completing the challenge, and I love how you split your css files.

    The only feedback I have is that you should check out 'CSS CLAMP', it could potentially reduce the amount of media queries you need.

    1
    Bartosz Dudziak•720
    @bartoszdudziak-devPosted 10 months ago

    @AcharaChisomSolomon Hi! Thank you! I use clamp especially for font sizes if it is needed. Do you think is it good practice to use it for also for things like padding, margin or width?

    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