From f4ce1f337e54894f683e4fe34487418510b0748d Mon Sep 17 00:00:00 2001
From: Book Pauk <bookpauk@gmail.com>
Date: Wed, 11 Jan 2023 13:22:43 +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                        | 16 +++++++++++++---
 .../LoaderPage/PasteTextPage/PasteTextPage.vue   | 10 +++++-----
 client/components/Reader/Reader.vue              |  2 +-
 client/components/share/Window.vue               |  6 +++---
 4 files changed, 22 insertions(+), 12 deletions(-)

diff --git a/client/components/App.vue b/client/components/App.vue
index 56ee2ac7..99a67067 100644
--- a/client/components/App.vue
+++ b/client/components/App.vue
@@ -50,7 +50,8 @@ class App {
             if (darkMode !== value) {
                 const vars = [
                     '--bg-app-color', '--text-app-color', '--text-anchor-color',
-                    '--bg-input-color', '--bg-btn1-color'
+                    '--bg-loader-color', '--bg-input-color', '--bg-btn1-color',
+                    '--bg-header1-color', '--bg-header2-color',
                 ];
 
                 let root = document.querySelector(':root');
@@ -223,22 +224,31 @@ export default vueComponent(App);
     --bg-app-color: #fff;
     --text-app-color: #000;
     --text-anchor-color: #00f;
+    --bg-loader-color: #ebe2c9;
     --bg-input-color: #fff;
     --bg-btn1-color: #1976d2;/* primary */
+    --bg-header1-color: #007000;
+    --bg-header2-color: #59B04F;
 
     /* light */
-    --bg-app-color-light: #ebe2c9;
+    --bg-app-color-light: #fff;
     --text-app-color-light: #000;
     --text-anchor-color-light: #00f;
+    --bg-loader-color-light: #ebe2c9;
     --bg-input-color-light: #fff;
     --bg-btn1-color-light: #1976d2;/* primary */
+    --bg-header1-color-light: #007000;
+    --bg-header2-color-light: #59B04F;
 
     /* dark */
     --bg-app-color-dark: #222;
-    --text-app-color-dark: #bbb;
+    --text-app-color-dark: #ccc;
     --text-anchor-color-dark: #09f;
+    --bg-loader-color-dark: #222;
     --bg-input-color-dark: #333;
     --bg-btn1-color-dark: #00695c;/* teal-9 */
+    --bg-header1-color-dark: #004000;
+    --bg-header2-color-dark: #29901F;
     
 }
 
diff --git a/client/components/Reader/LoaderPage/PasteTextPage/PasteTextPage.vue b/client/components/Reader/LoaderPage/PasteTextPage/PasteTextPage.vue
index b473f5d2..5aeaa59c 100644
--- a/client/components/Reader/LoaderPage/PasteTextPage/PasteTextPage.vue
+++ b/client/components/Reader/LoaderPage/PasteTextPage/PasteTextPage.vue
@@ -8,10 +8,10 @@
             </span>
         </template>
 
-        <div class="fit column" :class="{dark}">
+        <div class="fit column main">
             <q-input v-model="bookTitle" class="q-px-sm" dense borderless placeholder="Введите название текста" />
             <hr />
-            <textarea ref="textArea" class="text" :class="{dark}" @paste="calcTitle"></textarea>
+            <textarea ref="textArea" class="main text" @paste="calcTitle"></textarea>
         </div>
     </Window>
 </template>
@@ -121,9 +121,9 @@ export default vueComponent(PasteTextPage);
     outline: none;
 }
 
-.dark {
-    color: white;
-    background-color: #333;
+.main {
+    color: var(--text-app-color);
+    background-color: var(--bg-app-color);
 }
 
 hr {
diff --git a/client/components/Reader/Reader.vue b/client/components/Reader/Reader.vue
index 14381f3f..f4403014 100644
--- a/client/components/Reader/Reader.vue
+++ b/client/components/Reader/Reader.vue
@@ -1697,7 +1697,7 @@ export default vueComponent(Reader);
 }
 
 .main {
-    background-color: var(--bg-app-color);
+    background-color: var(--bg-loader-color);
     color: var(--text-app-color);
 }
 
diff --git a/client/components/share/Window.vue b/client/components/share/Window.vue
index d41d660e..a1c15fef 100644
--- a/client/components/share/Window.vue
+++ b/client/components/share/Window.vue
@@ -148,14 +148,14 @@ export default vueComponent(Window);
 
 .window {
     margin: 10px;
-    background-color: #ffffff;
-    border: 3px double black;
+    background-color: var(--bg-app-color);
+    border: 3px double var(--text-app-color);
     border-radius: 4px;
     box-shadow: 3px 3px 5px black;
 }
 
 .header {
-    background: linear-gradient(to bottom right, #007000, #59B04F);
+    background: linear-gradient(to bottom right, var(--bg-header1-color), var(--bg-header2-color));
     align-items: center;
     height: 30px;
 }