Mobile first approach, Semantic HTML, responsive CSS, ES6, SASS

Hello everyone!

This is my first challenge with JS, it took a bit longer than expected. It is also the longest SASS file I had to write due to the amount of components and states.

In my sass file can you give me some feedback on my approach to using variables for the colours in the theme.. how would recommend improving the way I group them and made them relate to each other?

My JS approach. I used a self-invoking function with private variables to keep the calculator modular. Would you recommend a different way of doing this?