From 5e8afa15b25e0a226dcb5507ff06034951398cca Mon Sep 17 00:00:00 2001
From: Book Pauk <bookpauk@gmail.com>
Date: Wed, 11 Jan 2023 12:57:40 +0700
Subject: [PATCH] =?UTF-8?q?=D0=A0=D0=B0=D0=B1=D0=BE=D1=82=D0=B0=20=D0=BD?=
 =?UTF-8?q?=D0=B0=D0=B4=20=D0=BD=D0=BE=D1=87=D0=BD=D1=8B=D0=BC=20=D1=80?=
 =?UTF-8?q?=D0=B5=D0=B6=D0=B8=D0=BC=D0=BE=D0=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/components/App.vue                     | 34 +++++++++++++++----
 .../Reader/LoaderPage/LoaderPage.vue          |  6 ++--
 client/components/Reader/Reader.vue           |  4 +--
 3 files changed, 32 insertions(+), 12 deletions(-)

diff --git a/client/components/App.vue b/client/components/App.vue
index 4a0f411e..56ee2ac7 100644
--- a/client/components/App.vue
+++ b/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;
diff --git a/client/components/Reader/LoaderPage/LoaderPage.vue b/client/components/Reader/LoaderPage/LoaderPage.vue
index 5c1b7983..7c9ca3e1 100644
--- a/client/components/Reader/LoaderPage/LoaderPage.vue
+++ b/client/components/Reader/LoaderPage/LoaderPage.vue
@@ -29,13 +29,13 @@
             />
 
             <div class="q-my-sm"></div>
-            <q-btn no-caps dense class="q-px-sm" size="13px" @click="loadFileClick">
+            <q-btn no-caps dense class="q-px-sm" color="btn1" size="13px" @click="loadFileClick">
                 <q-icon class="q-mr-xs" name="la la-caret-square-up" size="24px" />
                 Загрузить файл с диска
             </q-btn>
             
             <div class="q-my-sm"></div>
-            <q-btn no-caps dense class="q-px-sm" size="13px" @click="loadBufferClick">
+            <q-btn no-caps dense class="q-px-sm" color="btn1" size="13px" @click="loadBufferClick">
                 <q-icon class="q-mr-xs" name="la la-comment" size="24px" />
                 Из буфера обмена
             </q-btn>
@@ -217,7 +217,7 @@ export default vueComponent(LoaderPage);
 }
 
 .clickable {
-    color: blue;
+    color: var(--text-anchor-color);
     text-decoration: underline;
     cursor: pointer;
 }
diff --git a/client/components/Reader/Reader.vue b/client/components/Reader/Reader.vue
index 7680be9d..14381f3f 100644
--- a/client/components/Reader/Reader.vue
+++ b/client/components/Reader/Reader.vue
@@ -1697,8 +1697,8 @@ export default vueComponent(Reader);
 }
 
 .main {
-    background-color: var(--app-bg-color);
-    color: var(--app-text-color);
+    background-color: var(--bg-app-color);
+    color: var(--text-app-color);
 }
 
 .tool-button {