Tip calculator app

Hi @ahmed-Faroolle good djob 👍, let me give you some tips that can help you👨‍💻.

• You can use regex to format text in your field input instead type= 'number' to avoid to have a default vertical row in your input. Code:

<input type="text" ... oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*?)\..*/g, '$1');">

• In your <div class="checkboxes__grid"> replace input and label to avoid to use label for write percentage 5% instead button . Code:

HTML

<div class="checkboxes__grid">
              <button class="check__box" id="fivepercent" value="5">5%</button>
              <button class="check__box" id="tenpercent" value="10">10%</button>
               ...
              <input type="text" placeholder="Custom" class="check__box custom" id="inputcustom"
              oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*?)\..*/g, '$1');">
</div>

JS

var selectTipTab = document.querySelectorAll('.check__box');

// add logic when we click on a button
selectTipTab.forEach(element => {
    element.addEventListener('click', () => {
      ...
    })
});

I hope it will be useful for you good code 🤞 (⌐■_■)