Submitted almost 3 years ago

Interactive pricing component [Parcel/SASS/BEM]

parcel, sass/scss, bem

Iván De León Lino•600

@Lino-OTM

A solution to the Interactive pricing component challenge

Preview Code

Solution retrospective

I spent some time learning how to change the appearance of the slider, there were many different ways such as using box-shadow, using a div, or jquery. But I wanted to use an efficient method so I worked with a background color and a background image, the image is the progress bar, and depending on what you select, its width will change [0%, 25%, 50%, 75%, 100%]. There might be better ways to do this but I found this one more suitable for me. Apart from that everything was easy!

-Edit: somehow the screenshot does not show my solution properly.

Code

Please log in to post a comment

Community feedback

No feedback yet. Be the first to give feedback on Iván De León Lino'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