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

Flexbox, Add Event Listener, ParseFloat,

Jason 90

@Mister-Zeng

Desktop design screenshot for the Tip calculator app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Community feedback

Ayush Nath 360

@Beats-Ayush

Posted

Hello nice attempt at this challenge. Some points where there can be improvement -

  • Instead of setting <input type='number' />, maybe use <input type='text' /> or simply remove the spinner arrows to improve the UI.
  • Upon Reset, the custom input is not being cleaned up.
  • Look out for the NaN values which are coming up whenever the custom input gets cleared up and then focused again.
0

Jason 90

@Mister-Zeng

Posted

@Beats-Ayush using type number allows me to not write function to ensure it is a number. I also removed the spinner from the UI but can still be used as an option. The custom input, I set it as a default of 1 as it is the minimum.

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