Submitted about 3 years ago

Calculator using Vue.js, scss, grid, custom properties, localStorage

Kristian Kalvå• 360

@kkalvaa

Preview site(opens in new window)View code(opens in new window)

This is a solution for...

Calculator app

HTML
CSS
JS

3intermediate

View challenge

Design comparison

SolutionDesign

Solution retrospective

The calculator will respect your device's dark mode setting, and high contrast mode if set. You can manually change to a different theme, and the calculator will remember that choice in localStorage.

Community feedback

Chamu• 13,110

@ChamuMutezva

Posted about 3 years ago

Well done, looking great.

replacing the operator with a zero can be confusing to the user, maybe keeping the operand or displaying the operator to the screen
1 + 1 will give you the correct result 2 but to continue the operation from there will start giving you the wrong results.
When entering a floating number, the dot does not show until you press a number. That's confusing as some users will think that the dot is not working.
I cannot enter a floating number with more than 5 digits with some rounding happening during data entering

Please log in to post a comment

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