CSS Variables for theming

[prachi00]

    @roiLeo @yangwao @vikiival @Jarsen136 @petersopko @preschian 

I am really tired of writing double css, once in light mode and then in dark mode, I researched and figured this would be the best way to make sure that css is only written once for all themes
With this approach, we can get rid of _Dark.scss and _light.scss files

Let me know if this seems okay to you, or you would prefer some other way of doing it?
I couldnt really find anything for using scss variables theming directly without any mixins

I have some time because of the holidays going on, I can do this transition, I feel like it would speed up our development by doing this once and for all

Originally posted by @prachi00 in #4579 (comment)

[prachi00]

Waiting for more inout before I start working on this :)

[yangwao]

I really appreciate the effort to make it easier to manage code.
Hence we are getting a bit complex app, and with the redesign on top, I see a lot of quirky back-and-forth visual conflicts repeating.
I would nominate for suggestions from others; probably @roiLeo @preschian @Jarsen136 can have some great suggestions and the best approach. :)