Interactive pricing component

Community feedback

• 

  Victor•1,400

  @VictorKevz

  Posted about 1 year ago

  Great job completing this challenge, for me as funny as it may sound, I had trouble with that little heading 😅 which caused me to miss the alignment with the design. I see you didn't manage to customize your slider, I hope you find this code helpful. Otherwise, your solution looks great!👍🏽

  .slider { width: 100%; height: 8px; position: relative; appearance: none; background: var(--light-grayish-blue-slider); border-radius: .5rem; cursor: pointer; transition: all 0.3s ease; }

  .slider::-webkit-slider-thumb { appearance: none; background-image: url("../../assets/images/icon-slider.svg"); background-color: var(--strong-cyan); background-repeat: no-repeat; background-position: center; border-radius: 50%; transition: all .3s ease-in-out; width: 40px; height: 40px; box-shadow: 0 1.6rem 3.2rem hsl(174, 97%, 48%); cursor: pointer; }

  01

  Marked as helpful