Работа над ночным режимом

client/components/App.vue

@@ -48,7 +48,10 @@ class App {
         let darkMode = null;
         this.$root.setDarkMode = (value) => {
             if (darkMode !== value) {
-                const vars = ['--app-bg-color', '--app-text-color', '--bg-input-color'];
+                const vars = [
+                    '--bg-app-color', '--text-app-color', '--text-anchor-color',
+                    '--bg-input-color', '--bg-btn1-color'
+                ];
 
                 let root = document.querySelector(':root');
                 let cs = getComputedStyle(root);
@@ -214,27 +217,44 @@ export default vueComponent(App);
 </style>
 
 <style>
+/* color schemes */
 :root {
     /* current */
-    --app-bg-color: #fff;
-    --app-text-color: #000;
+    --bg-app-color: #fff;
+    --text-app-color: #000;
+    --text-anchor-color: #00f;
     --bg-input-color: #fff;
+    --bg-btn1-color: #1976d2;/* primary */
 
     /* light */
-    --app-bg-color-light: #ebe2c9;
-    --app-text-color-light: #000;
+    --bg-app-color-light: #ebe2c9;
+    --text-app-color-light: #000;
+    --text-anchor-color-light: #00f;
     --bg-input-color-light: #fff;
+    --bg-btn1-color-light: #1976d2;/* primary */
 
     /* dark */
-    --app-bg-color-dark: #222;
-    --app-text-color-dark: #bbb;
+    --bg-app-color-dark: #222;
+    --text-app-color-dark: #bbb;
+    --text-anchor-color-dark: #09f;
     --bg-input-color-dark: #333;
+    --bg-btn1-color-dark: #00695c;/* teal-9 */
+    
+}
+
+a {
+    color: var(--text-anchor-color);
 }
 
 .bg-input {
     background-color: var(--bg-input-color);
 }
 
+.bg-btn1 {
+    background-color: var(--bg-btn1-color);
+}
+
+/* main section */
 body, html, #app {    
     margin: 0;
     padding: 0;