Skip to content
Submitted over 3 years ago

tip calculator app

AngelusLovell•245
@AngelusLovell
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

Any Feedback is much appreciated, Also please help me solve the following problems -

What is the "Total / person" represent, I don't have any experience tipping. so, I simply made it to be the product of "tip / person" and "no of people". However in doing so, the default value miss-match. It is wrong, I assume. So, please correct me and let me know what does it refers to.

Also how do I do something like this, with "this" operator - htmlElement.addEventListener("keyup", () => { myFunction(htmlElement) }); function myFunction(thisElement) { thisElement.value = something; }

Thank you.

Community feedback

  • Chamu•13,130
    @ChamuMutezvaPosted over 3 years ago

    So a bill of $100 is presented for a meal in a restaurant for you and your friend. Both of you have agreed to share equally the bill plus the generous tip you are going to give the waiter. Let's say you agreed on a 10 percent of the bill to be the tip. The total tip is $10. tip/person is $5 and the share of the bill is $50. total/person is $55

    That is how I would work it

    Marked as helpful
    1
    AngelusLovell•245
    @AngelusLovellPosted over 3 years ago

    @ChamuMutezva Thank you bro, I appreciate your help.😘

    0
  • Ahmed Faisal•5,095
    @afrusselPosted over 3 years ago

    Hi, Using a default value on input is not a good idea may be.

    • The main container is not center aligned
    • After body tag make this <main class="page"> instead of div using main
    1
    AngelusLovell•245
    @AngelusLovellPosted over 3 years ago

    @afrussel Thank you, for the pointers. It was useful.

    I create a parent div "page" element containing everything in the screen, mainly to contain header, main and footer element. And try to use it as we would with the body element, thinking that it might create complexion if we try to style the body element with js Which is dumb i guess.

    So, thank you. I will keep those pointer in mind and correct my code in these challenge.

    0
  • uiGuy•255
    @uiGuysPosted over 3 years ago

    JS not working in my PC. Without having refresh its not working most of the time

    0
    AngelusLovell•245
    @AngelusLovellPosted over 3 years ago

    @uiGuys Is it really? It's working fine for me. Can someone please check and let me know if you are having to refresh every time you are checking for new results. 😀

    1
    AngelusLovell•245
    @AngelusLovellPosted over 3 years ago

    @uiGuys Oh, you mean, JavaScript for your code is not working, can u reply to confirm?

    0
    uiGuy•255
    @uiGuysPosted over 3 years ago

    @ShashaGazem Now it's working. It's my fault. After using private browser it's working now.

    0
    AngelusLovell•245
    @AngelusLovellPosted over 3 years ago

    @uiGuys congrats bro. And hope to see you around 😁.

    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