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

Calculator app - HTML, SCSS, JS, FlexBox, mobile-first, BEM & Parcel

#accessibility#bem#parcel#sass/scss
darryncodesβ€’ 6,430

@darryncodes

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


Hi everyone πŸ‘‹

This challenge was gruelling and rewarding in equal measures.

I took it as an opportunity to implement and learn the following:

  • working with local storage to remember the user's theme preference
  • using parcel-bundler
  • get a small amount of practice using JavaScript modules

I've had a few thoughts on where I can improve the project further over the next few weeks:

  • improving accessibility for the triple input toggle
  • the size of the toggle needs to increase for mobile users
  • wrapping the text for extremely long numbers and including commas

Any feedback that could help me to improve would be very welcome!

Happy coding πŸ€™

Community feedback

Jamesβ€’ 390

@neenreva

Posted

Nice work as always. When you mentioned the formatting improvements for the future the toLocaleString() method comes to mind. I'll leave an MDN link and let you figure out if it's useful.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString

Marked as helpful

0
Kamasah-Dicksonβ€’ 5,610

@Kamasah-Dickson

Posted

When the answers become huge I think the container spans across the screen. Well nice solution thereπŸ‘

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