Skip to content
Submitted about 2 years ago

TIP CALCULATOR APP

Maria Luisa Durães•160
@MariaLuisaMD
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Tip calculator app
  • HTML
  • CSS
  • JS
2junior

Design comparison

SolutionDesign

Solution retrospective

In this challenge I had some difficulties with the DOM and hover states, as well as some specific difficulties in the JS. I had to research a lot on how to solve the problems that arose, it took me longer than I expected to finish, but I found a good challenge. Suggestions on design and how to improve are always welcome

Community feedback

  • Dushyant Goyal•260
    @goyal-DushiPosted about 2 years ago

    It works well, just few UI tips you can consider :

    1. Give input field some padding from right so that the number input doesn't stick to edges
    2. The label tag used for input field is missing attribute ( for )
    3. The heading spelling : SPL ( I ) TTER not SPL ( Y ) TTER :)

    Also, as a bonus, try saving the input values entered by user in local storage of browser so that on page refresh, the values aren't lost. On reset, you can clear local storage.

    Marked as helpful
    0

Please log in to post a comment

Log in with GitHub

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