refactor(app, components, protocol-designer): add touch odd css class

[shlokamin]

Overview

This PR adds a new CSS class meant to indicate that the window is being rendered on the ODD. it's a bit of a hack, but AFAIK there is no way to configure this in electron and after reading through enough linux graphic threads im convinced configuration on the openembedded side is beyond my capabilities.

This will replace the ODD media query that looked for the specific screen width and height like so:

export const touchscreenMediaQuerySpecs = '(height: 600px) and (width: 1024px)'

Which will make our components safer to use in web environments

Changelog

• Add CSS class for ODD touch screen

Review requests

Make sure the desktop app ODD app looks like they should

Risk assessment

Medium

[sfoster1]

I think this is a great way to do this, honestly. Sure ideally it would be something we could pass in as a command line flag to electron or something but I'm not sure that's a thing we can do anyway.

I guess the other possibility would be putting it in the electron preload script, if we really really really wanted to keep it out of the app code? I don't think it's that big of a deal though and if we do want to put it there we can change it.

[jerader]

this seems like a good approach to me