feat(ui): implement CSS variables for theme support (#26)

#17

Reviewed-on: #26
Reviewed-by: lq64 <lq@blackhole.local>
Co-authored-by: Janis <janis.e.20@gmx.de>
Co-committed-by: Janis <janis.e.20@gmx.de>

knockoutwhistweb/app/assets/stylesheets/dark-mode.less

@@ -1,2 +1,6 @@
-@background-image: url('/assets/images/background.png');
-@color: white;
+@media (prefers-color-scheme: dark) {
+  :root {
+    --background-image: url('/assets/images/background.png');
+    --color: white;
+  }
+}

knockoutwhistweb/app/assets/stylesheets/light-mode.less

@@ -1,2 +1,4 @@
-@background-image: url('/assets/images/img.png');
-@color: black;
+:root {
+  --background-image: url('/assets/images/img.png');
+  --color: black;
+}

knockoutwhistweb/app/assets/stylesheets/main.less

@@ -1,4 +1,9 @@
 @import "light-mode.less";
+@import "dark-mode.less";
+
+@background-image: var(--background-image);
+@color: var(--color);
+
 body {
     background-image: @background-image;
     background-size: 100vw 100vh;