Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

HTML and SCSS and Vanilla JS

Alucard 870

@Alucard2169

Desktop design screenshot for the Tip calculator app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


First time doing this kind of project, I know the functionality is terrible and really build on best practice, but i am still learning JS and will come back to it to make it better.

If you guys have any feedback, criticism than please feel free to reply, i will appreciate that.

Thank you.

Community feedback

Donald 280

@millidavitti

Posted

Went through your code an saw this little change you could make. The code below can be written on one line, billValue.value = null; headCount.value = null; tipButtons.value = null; customTip.value = null;

The one linner code would be: billValue.value=headCount.value= tipButtons.value= customTip.value = null;

Marked as helpful

1
Paola 320

@paolas771

Posted

Hello you did a good job. When using this page I’m assuming they are filling it out from top to bottom. To improve your site, instead of having an event listener on the tip buttons you can have it on the number of people input and have your calculate function in there so the user does not have to press the tip button again. So as soon as the user enters number of people the outputs are updated You could also make the number of people box the same size of the bill input box so it’s looks nicer.

Marked as helpful

0

Alucard 870

@Alucard2169

Posted

@paolas771 Thanks for your feedback, and yes i am gonna do that now. Thank you

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord