And so, I’ve written around 90 lines of HTML code in around 45 ish minutes with some prior planning and stuff, and surprisingly enough, the basic structure of the interface is starting to look very good. In general, I’ve managed to outline all major parts of the interface, organize the containers, and even prepare a base layout that shows how Scale Spot should look upon its loading. It might be a bit early to say something about this, but the foundation seems solid enough, and now I can imagine how the interface will end up looking.

In the process, there was one pretty annoying problem with the implementation of the light/dark theme switching functionality. In particular, the styles of certain elements were not changing at all and kept remaining within the incorrect theme. By investigating the CSS and how classes were applied, I managed to discover the cause of the problem and fix it. Now the theme switcher works perfectly fine and it is nice to see how all the interface switches between themes correctly.

Now that everything is done, the HTML layout is ready, the theme system works, and it is time to implement the input audio and the logic of the pitch detection itself.