Skip to content
OverviewSolutions
5
Comments
5
Guilherme Santos
@guisantosfr

All comments

  • daniel•80
    @retailescapeartistSubmitted 12 months ago

    I did have some issues remembering the CSS for Grid. I'm still not sure about styling, but I'm getting there. I'm working on finding better ways to visualize the separate components.

    Used CSS grid

    2
    Guilherme Santos•120
    @guisantosfrPosted 12 months ago

    Hi, Daniel! Nice solution. My suggestion for you is to add a little more margin on left and right sides.

    Happy coding :)

    0
  • VincentPellechia•20
    @VincentPellechiaSubmitted over 1 year ago

    I found this was a very comprehensive task to test my abilities with React, and CSS. I feel like I have a lot to improve on with CSS and the more I use it the better I will become. If there are any improvements I can make with the className conventions and how they relate to CSS I would love the advice!

    Tip Calculator Application

    1
    Guilherme Santos•120
    @guisantosfrPosted over 1 year ago

    Hi, Vincent!

    I also completed this challenge recently. A little suggestion for you is to change the input types to type='number' to accept only numbers and avoid NaN as results.

    1
  • Edward Dzongololo•80
    @EdwardDzongololoSubmitted over 1 year ago

    I have spent quite a good time working on this. I managed to get everything working except for the custom button. Feel free to go through my code and any help rendered will be highly apricated.

    Tip-calculator

    1
    Guilherme Santos•120
    @guisantosfrPosted over 1 year ago

    Hi, Edward. I also completed this challenge recently and i have two advices for you to improve the application.

    • Include type='number' on inputs, to accept only numbers
    • Use .toFixed(2) in javascript, to display results in screen with two decimal places.

    Happy coding :)

    0
  • Guilherme Santos•120
    @guisantosfrPosted over 1 year ago

    Hi, Namiq! Nice solution. I also completed this challenge, and liked the mobile-first approach.

    A little suggestion to improve the solution:

    • Instead of padding on main-box, use this on mobile version, adjusting the values if you like
    width: 80%;
margin: 4rem auto;

    Good work. Happy coding 🚀

    1
  • IgnatiusVisnu•70
    @IgnatiusVisnuSubmitted over 1 year ago

    I managed to make the features work, but I still don't understand how to make the code HTML Semantics. I'm also not sure if there's a better way to position the "SPLITTER" text and to make number of people input form border red as I put 0 number (it only turns red after I click somewhere outside the form, I think it's overridden by input form focus default of the form control). Any suggestions are definitely welcome

    Tip Calculator App using Flexbox and CSS Grid

    1
    Guilherme Santos•120
    @guisantosfrPosted over 1 year ago

    Hi, Ignatius! I also completed this challenge recently.

    A little suggestion for you is to include type=number on Bill, Custom and Number of people inputs, to allow only numbers and avoid Nan as results.

    Happy coding 😉

    0