HTML, CSS, Pure JS

Community feedback

• 

  David•8,000

  @DavidMorgadePosted about 2 years ago

  Hello Ibrohim, congrats on finishing the challenge! I like a lot the additional effect that you gave to all the buttons that has less value than the selected, it looks really nice!

  The only little thing that I would add to your project is an alert() or maybe a simple popup that shows when the users try to submit when no rating was selected! you can get this easily in your Javascript adding just an if check with the condition and returning if no value was selected, something like this:

  button.addEventListener('click', () => {
    if(amount === ''") return alert('Please select a rating before submitting!')
      container.innerHTML = `
      <div class='submitted'>
        <img src=${imgUrl}>
        <p class='count'>You selected ${amount} out of 5</p>
      </div>
      <div class="text active">
        <h1>Thank you!</h1>
        <p>We appreciate you taking the time to give a rating. If you ever need more support, don't hesitate to get in touch</p>
      </div>
      `;
  });
  

  Changing the condition to a falsy value and returning will stop the function and no rating will be displayed, just the alert window, if a rating gets selected, the alert if check will be ignored and your function will execute like normal!

  Hope my feedback helps you! great work!

  Marked as helpful

  1

  ---

  

  Ibrohim•210

  @Ibrohim2001Posted about 2 years ago

  @DavidMorgade Hello sir, that was the missing feature, I've added small popup as you said, thank you for taking your time and reviewing my code!

  1