Design comparison
Solution retrospective
I had issues on the custom button and am yet to figure it out. Also setting the value to .toFixed(2) always return a string not a number, if you have better way, you could tell me? Also when I resolve the custom input, i would be moving the state to context, in other to manage my state properly and make my code cleaner.
thank you, your feedback will be great
Community feedback
- @ChamuMutezvaPosted over 2 years ago
Greetings josephe44. Congratulations for taking this challenge and going that far. Here are a few recommendations:
- the display generally looks good, some improvements can be made to increase the font size of the buttons which looks small to me. On mobile some of the input elements are overflowing their container, using dev tools , check at below 360px.
- all the input elements should be in one form element , what is the reason you chose to have to form elements?
- validate for negative input numbers. I also didn't see how to use the custom button, when i use it nothing changes.
- Whilst there are labels, your input elements are not link to any labels.
- Some issues raised in the automated response include a level-one heading which is missing and landmarks such as the main element which is also missing.
- the calculations looks ok
Marked as helpful1 - @alisariyerPosted over 2 years ago
Hi Josephe,
I hope you're fine,
You have a good work Josephe. I spent a little time for your bugs, I used your tip state callback inside handleCustomTip and used also parseFloat(({your calculation}).toFixed(2)) to fix string issue. You can always enhance your codes. So I opened a pull request on GitHub, you can observe my code changings in TipCalculForm.jsx file on your GitHub repository. If you like, you can merge. I hope these will help you.
Have a nice coding!
0@josephe44Posted over 2 years ago@alisariyer thank you so much, i saw it and it helpful.
1
Please log in to post a comment
Log in with GitHubJoin 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