RESPONSIVE CALCULATOR USING PURE HTML, CSS AND JAVASCRIPT

This is my solution to this Calculator App, help me review it and check its responsiveness.

I used input[type=range] for my theme slider and that made my code longer as I had to override the default browser styling for different browsers (Firefox and Edge not working as expected).

My approach was to change the body class whenever the range value changes. I've commented some block of code that is meant to get the theme from the local storage and set the theme to the corresponding value. The code is currently not working, the theme returns to default on refreshing the page.

I also have an issue with the functionality, I want to prevent the keydown of "." twice in a single operand and also change the inner text of the answer screen to 'Syntax Error' when the user enters operators in an illogical order. If you view my calculator.js file, you're going to see the regex I commented out, some of the test cases failed. How do I fix this? Regex?

I hope to get help with this. Thanks :)