FE projevcts: JS / React calculator

Hi all,

If any folks have the time spare I’d be very grateful of any feedback you have on my calculator here:

https://codepen.io/bemorr/pen/BaoLQXv

TIA,
Ben.
:partying_face:

1 Like

I like the styles you have chosen, very original. Just a few issues underneath the hood.

  • When I increase the text size the calculator gets wider and the buttons spaced further apart, to the point that it creates a horizontal scroll bar.
    When I make the browser window shorter and cause the display to go above the top of the viewport, I am not able to scroll high enough to get the display back.
  • At the default font size, the dark text on red buttons is not quite accessible (not enough contrast). If you make the text pure black (#000) then it will be accessible. You can check contrast accessibility at
    https://webaim.org/resources/contrastchecker/
  • I think the keyboard focus indicator needs to be more prominent. I can barely tell where my focus is.

Very nice background design. I like it.

Thanks very much for the feedback folks!