HTML SASS JS Responsive - tip calculator app.

Community feedback

• 

  Oscar Carvajal•120

  @ocarmoraPosted almost 3 years ago

  Hi! You did it very well! Congratulations! If you want to improve the UI maybe could add some styles to inputs type number to hide the arrows when you do focus on it. This could help you: https://www.w3schools.com/howto/howto_css_hide_arrow_number.asp

  1

  ---

  

  Lenfumé Julien•350

  @julabinaPosted almost 3 years ago

  @oscarvajalmora hi, Thank you. I just modified the inputs. Thanks for the link.

  0

  

  Oscar Carvajal•120

  @ocarmoraPosted almost 3 years ago

  @julabina It looks very well! Congrats!

  0
• 

  hariprasad9899•1,170

  @hariprasad9899Posted almost 3 years ago

  Hi,

  Just a suggestion for precise js. Instead of adding an event listener for every tipstipsAmount[1....5], create a for loop and iterate over it for each tipsAmount in a single block. Like the below.

  for ( let i = 0; i < tipsAmount.length;i++ ){

  customVal = 0;
  customAmount.value = "";
  if (tipsAmount[i].classList.contains("left__selectTips__cont__amount--selected")) {
      tipsAmount[i].classList.remove("left__selectTips__cont__amount--selected");
      tipPercent = 0;
  } else {
      resetSelectedAmount();
      tipsAmount[i].classList.add("left__selectTips__cont__amount--selected");
      tipPercent = 5;
  }
  calcul();
  

  }

  this will add an event listener to all the buttons, as you wish.

  Happy Coding !! :)

  0