Desktop First with HTML, CSS, Vanilla JS

Community feedback

• 

  Raymart Pamplona•16,100

  @pikapikamartPosted over 3 years ago

  Hey. For class naming I suggest that you read some BEM principles or blogs about it. It is one convention when writing up class when we are coding. Understanding it and making a habit of using it will surely solve your problem. (bem advocator). About your javascript code, well, since you are using input range there. You don't have to necessarily define some constant in your js. What you could do is, just make an event listener to that input range, an event listener of input. Then inside it, you could just target a specific element right, like the price with the dollar sign, then just add inside it a snippet like document.querySelector("target").textContent = this.target.value something like that, there are other approach but that is one. Feel free to ask anything here and we'll help you^

  1

  ---

  

  SuzuMantan•370

  @agusthasPosted over 3 years ago

  @pikamart hello there. Thank you for your suggestion on BEM classes, i‘ll look further on that!. And for the JavaScript advice, i didnt even realize i could do that . It seems i was too exhausted from the CSS & design 😅. Once again thank you for the advice!

  0

  

  Raymart Pamplona•16,100

  @pikapikamartPosted over 3 years ago

  @agusthas Your welcome on that and that's okay, we get tired out sometimes right haha just rest and keep coding^

  0
• 

  T

  ApplePieGiraffe•30,545

  @ApplePieGiraffePosted over 3 years ago

  Hi there, SuzuMantan! 👋

  Congratulations on completing your first Frontend Mentor challenge! 🎉 Good effort on this one! 👍

  Something you should probably be aware of is that the slider is only styled on Firefox—other browsers like Chrome, Safari, and Edge might not support some of the features you used to style the input element.

  I also suggest adding some space between the card and the bottom of the page (using margin/padding) so that there's always some room between the two (even when the height of the screen decreases in the desktop layout). 😉

  Keep coding (and happy coding, too)! 😁

  0

  ---

  

  SuzuMantan•370

  @agusthasPosted over 3 years ago

  @ApplePieGiraffe hello 👋, thank you for your advice on the browser support and margin/padding. I‘ll look further into that 😄

  0