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

HTML, Sass and JavaScript. I added a few extra features too!

Tesla_Ambassadorβ€’ 2,980

@tesla-ambassador

Desktop design screenshot for the Calculator app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hey, guys, this is my first app and I added some scientific methods to it like sin, cos...etc.. It's functionality is pretty good but it still has some flaws, I hope you can look into my code and advise me on how to make it better! Your feedback will be very much appreciated.

Community feedback

P
ApplePieGiraffeβ€’ 30,545

@ApplePieGiraffe

Posted

Hey, Kevin! πŸ‘‹

It's so good to see you complete another challenge! πŸ˜€ You've done a nice job on this one and I love the ideas you had for the extra features you added! 🀩

A few small tips to improve the design of your solution would be,

  • Using the font specified in the style guide for this challenge for a few of the text elements on the page (such as the text in the calculator screen and the word "Calc" in the upper-left corner of the calculator).
  • Adding hover and active states to the calculator buttons. This will be a small touch that's probably quite easy to add but will make a big difference in the UX, I think! A simple background color change for the hover state and a subtle transform or something for the active state should do it.
  • This isn't a tip but I really like your attribution for this solution! πŸ˜‰

Also... it might be worth taking another look at the functionality of the scientific side of the calculator. There are a few quirks such as not being able to add/subtract/etc. with "Ο€" and not being able to delete items like "sin" or "tan". But for your first submission of this challenge, I think this is very cool! 😎

You've really improved and it's made me happy to see your progress! Keep it up! πŸŽ‰

And don't forgetβ€”keep coding (and happy coding, too)! πŸ˜„

Marked as helpful

0

Tesla_Ambassadorβ€’ 2,980

@tesla-ambassador

Posted

@ApplePieGiraffe Arigato Sensei, thanks for pointing out the issues for me and the tips! I will definitely work on the hover effect and I also noticed that you can't delete operators, this is because I used a similar function for both of them and I am still looking for a better function but I will keep you posted as soon as I improve it! Thanks for all the good advice bro! You keep on coding too and keep happy as you do it! Billion Dollar Hot dogs!

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