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

Tip Calculator App | SCSS + Vite

T

@gmagnenat

Desktop design screenshot for the Tip calculator app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

I started mobile first, did all the css for mobile and desktop before starting to write one single line of javascript.

Next time I need to plan a bit more the javascript before starting html and css as I had to refactor quite a few times.

What challenges did you encounter, and how did you overcome them?

There are quite some details to handle with javascript and it took me time. Probably by implementing tests this can be done much faster.

What specific areas of your project would you like help with?

I try to include accessible feature in my solution. Currently it is using the `` element.

I'd like to have something announced like "total per person: 100$, tip per person 5$". The issue I have is only the value is announced as the text stays the same. I try to clear the html before updating the value. Still the number only is announced. (I use firefox and voiceover on mac)

Community feedback

Konrad 370

@konradbaczyk

Posted

Well done :)

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