Not Found
Request path contains unescaped characters
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

HTML5, SCSS, FlexBox, CSS-Grid, JavaScript, Bem,Color-Scheme

Usman 45

@yaya-usman

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


This is my second challenge and my first shot at the intermediate level challenge, I had problem a bit implementing the prefers-colour-scheme property, initially, my styles started overlapping when I switch my PC from dark to light mode and vice versa which i didn't notice at first when i first submitted but thanks to @RMK-creative/Rachael for her feedback, it has been resolved. I had fun and learnt a lot creating this calculator, I would love feedback and probably a thumbs up 😉.

Let me add this note here: to switch themes, click the number to toggle.

Community feedback

Rachael 610

@RMK-creative

Posted

Hi Usman! Dark mode looks great, but the theme switcher isn't working for me.

Marked as helpful

1

Usman 45

@yaya-usman

Posted

@RMK-creative , really can you please give me a detailed review on what behavior it's exhibiting, I tested everything before submitting it, also to switch colors, you have to click the numbers not the toggle itself if that's where the problem lies

0
Rachael 610

@RMK-creative

Posted

@Elixir-K Oh I see, sorry I didn't try to click the numbers, it felt more intuitive to me to click on the actual switch. Clicking the numbers works ok, but for example when I click 1 the color theme changes but the actual toggle stays under the number 2. Similarly when I click number 2, the color theme changes but the switch sits under number 3.. I hope that makes sense? Also with themes 1 and 2 the yellow button numbers are hard to read - I wonder if the color needs to be adjusted just a bit? I hope this helps 😊

1
Usman 45

@yaya-usman

Posted

@RMK-creative ohh that's weird i mean the toggle issue, thank you very much for the response, i will resolve the issue and re-submit.

1

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