diff --git a/client/components/Reader/SettingsPage/ConvertTab/ConvertTab.vue b/client/components/Reader/SettingsPage/ConvertTab/ConvertTab.vue
index 44a803f4..ee55dc7c 100644
--- a/client/components/Reader/SettingsPage/ConvertTab/ConvertTab.vue
+++ b/client/components/Reader/SettingsPage/ConvertTab/ConvertTab.vue
@@ -71,7 +71,7 @@
                     Качество
                 </div>
                 <div class="col row">
-                    <NumInput v-model="form.pdfQuality" class="col-5" :min="10" :max="100">
+                    <NumInput v-model="form.pdfQuality" bg-color="input" class="col-5" :min="10" :max="100">
                         <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
                             Качество конвертирования Pdf в Fb2. Чем значение выше, тем больше<br>
                             размер итогового файла. Если сервер отказывается конвертировать<br>
@@ -93,7 +93,7 @@
                     Качество
                 </div>
                 <div class="col row">
-                    <NumInput v-model="form.djvuQuality" class="col-5" :min="10" :max="100">
+                    <NumInput v-model="form.djvuQuality" bg-color="input" class="col-5" :min="10" :max="100">
                         <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
                             Качество конвертирования Djvu в Fb2. Чем значение выше, тем больше<br>
                             размер итогового файла. Если сервер отказывается конвертировать<br>
diff --git a/client/components/Reader/SettingsPage/UpdateTab/UpdateTab.vue b/client/components/Reader/SettingsPage/UpdateTab/UpdateTab.vue
index 54f96795..7c2796d5 100644
--- a/client/components/Reader/SettingsPage/UpdateTab/UpdateTab.vue
+++ b/client/components/Reader/SettingsPage/UpdateTab/UpdateTab.vue
@@ -37,7 +37,7 @@
                 Разница размеров
             </div>
             <div class="col row">
-                <NumInput v-model="form.bucSizeDiff" style="width: 200px" />
+                <NumInput v-model="form.bucSizeDiff" bg-color="input" style="width: 200px" />
 
                 <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
                     Уведомлять о наличии обновления книги в списке загруженных<br>
@@ -73,7 +73,7 @@
             <div class="sets-label label"></div>
             <div class="col-4"></div>
             <div class="col row">
-                <NumInput v-model="form.bucCancelDays" :min="1" :max="10000" />
+                <NumInput v-model="form.bucCancelDays" bg-color="input" :min="1" :max="10000" />
 
                 <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
                     Снимать флаг проверки с книги, если не было<br>
diff --git a/client/components/Reader/SettingsPage/ViewTab/Color/Color.vue b/client/components/Reader/SettingsPage/ViewTab/Color/Color.vue
index 855372b8..9d9f4580 100644
--- a/client/components/Reader/SettingsPage/ViewTab/Color/Color.vue
+++ b/client/components/Reader/SettingsPage/ViewTab/Color/Color.vue
@@ -13,6 +13,7 @@
                 <q-input
                     v-model="textColorFiltered"
                     class="col-left no-mp"
+                    bg-color="input" 
                     outlined dense
                     
                     :rules="['hexColor']"
@@ -43,6 +44,7 @@
                 <q-input 
                     v-model="bgColorFiltered"
                     class="col-left no-mp"
+                    bg-color="input" 
                     outlined dense
                     
                     :rules="['hexColor']"
@@ -71,6 +73,7 @@
                     v-model="form.wallpaper"
                     class="col-left no-mp"
                     :options="wallpaperOptions"
+                    bg-color="input" 
                     dropdown-icon="la la-angle-down la-sm"
                     outlined dense emit-value map-options
                 >
diff --git a/client/components/Reader/SettingsPage/ViewTab/Font/Font.vue b/client/components/Reader/SettingsPage/ViewTab/Font/Font.vue
index a4ef6c86..f0c3614b 100644
--- a/client/components/Reader/SettingsPage/ViewTab/Font/Font.vue
+++ b/client/components/Reader/SettingsPage/ViewTab/Font/Font.vue
@@ -11,14 +11,14 @@
             </div>
             <div class="col row">
                 <q-select
-                    v-model="form.fontName" class="col-left" :options="fontsOptions" :disable="form.webFontName != ''"
+                    v-model="form.fontName" class="col-left" bg-color="input" :options="fontsOptions" :disable="form.webFontName != ''"
                     dropdown-icon="la la-angle-down la-sm"
                     outlined dense emit-value map-options
                 />
 
                 <div class="q-px-sm" />
                 <q-select
-                    v-model="form.webFontName" class="col" :options="webFontsOptions"
+                    v-model="form.webFontName" class="col" bg-color="input" :options="webFontsOptions"
                     dropdown-icon="la la-angle-down la-sm"
                     outlined dense emit-value map-options
                 >
@@ -36,7 +36,7 @@
                 Размер
             </div>
             <div class="col row">
-                <NumInput v-model="form.fontSize" class="col-left" :min="5" :max="200" />
+                <NumInput v-model="form.fontSize" bg-color="input" class="col-left" :min="5" :max="200" />
 
                 <div class="col q-pt-xs text-right">
                     <a href="https://fonts.google.com/?subset=cyrillic" target="_blank">Примеры</a>
@@ -49,7 +49,7 @@
                 Сдвиг
             </div>
             <div class="col row">
-                <NumInput v-model="vertShift" class="col-left" :min="-100" :max="100">
+                <NumInput v-model="vertShift" bg-color="input" class="col-left" :min="-100" :max="100">
                     <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
                         Сдвиг шрифта по вертикали в процентах от размера.<br>
                         Отрицательное значение сдвигает вверх, положительное -<br>
diff --git a/client/components/Reader/SettingsPage/ViewTab/Mode/Mode.vue b/client/components/Reader/SettingsPage/ViewTab/Mode/Mode.vue
index acebbb07..d7ddbb3b 100644
--- a/client/components/Reader/SettingsPage/ViewTab/Mode/Mode.vue
+++ b/client/components/Reader/SettingsPage/ViewTab/Mode/Mode.vue
@@ -27,13 +27,13 @@
                 Отступ границ
             </div>
             <div class="col row">
-                <NumInput v-model="form.indentLR" class="col-left" :min="0" :max="2000">
+                <NumInput v-model="form.indentLR" bg-color="input" class="col-left" :min="0" :max="2000">
                     <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
                         Слева/справа от края экрана
                     </q-tooltip>
                 </NumInput>
                 <div class="q-px-sm" />
-                <NumInput v-model="form.indentTB" class="col" :min="0" :max="2000">
+                <NumInput v-model="form.indentTB" bg-color="input" class="col" :min="0" :max="2000">
                     <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
                         Сверху/снизу от края экрана
                     </q-tooltip>
@@ -46,7 +46,7 @@
                 Отступ внутри
             </div>
             <div class="col row">
-                <NumInput v-model="form.dualIndentLR" class="col-left" :min="0" :max="2000">
+                <NumInput v-model="form.dualIndentLR" bg-color="input" class="col-left" :min="0" :max="2000">
                     <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
                         Слева/справа внутри страницы
                     </q-tooltip>
@@ -67,6 +67,7 @@
                     <q-input 
                         v-model="dualDivColorFiltered"
                         class="col-left no-mp"
+                        bg-color="input" 
                         outlined dense
                         :rules="['hexColor']"
                         style="max-width: 150px"
@@ -96,7 +97,7 @@
                     Прозрачность
                 </div>
                 <div class="col row">
-                    <NumInput v-model="form.dualDivColorAlpha" class="col-left" :min="0" :max="1" :digits="2" :step="0.1" />
+                    <NumInput v-model="form.dualDivColorAlpha" bg-color="input" class="col-left" :min="0" :max="1" :digits="2" :step="0.1" />
                 </div>
             </div>
 
@@ -105,7 +106,7 @@
                     Ширина (px)
                 </div>
                 <div class="col row">
-                    <NumInput v-model="form.dualDivWidth" class="col-left" :min="0" :max="100">
+                    <NumInput v-model="form.dualDivWidth" bg-color="input" class="col-left" :min="0" :max="100">
                         <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
                             Ширина разделителя
                         </q-tooltip>
@@ -118,7 +119,7 @@
                     Высота (%)
                 </div>
                 <div class="col row">
-                    <NumInput v-model="form.dualDivHeight" class="col-left" :min="0" :max="100">
+                    <NumInput v-model="form.dualDivHeight" bg-color="input" class="col-left" :min="0" :max="100">
                         <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
                             Высота разделителя
                         </q-tooltip>
@@ -131,13 +132,13 @@
                     Пунктир
                 </div>
                 <div class="col row">
-                    <NumInput v-model="form.dualDivStrokeFill" class="col-left" :min="0" :max="2000">
+                    <NumInput v-model="form.dualDivStrokeFill" bg-color="input" class="col-left" :min="0" :max="2000">
                         <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
                             Заполнение пунктира
                         </q-tooltip>
                     </NumInput>
                     <div class="q-px-sm" />
-                    <NumInput v-model="form.dualDivStrokeGap" class="col" :min="0" :max="2000">
+                    <NumInput v-model="form.dualDivStrokeGap" bg-color="input" class="col" :min="0" :max="2000">
                         <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
                             Промежуток пунктира
                         </q-tooltip>
@@ -150,7 +151,7 @@
                     Ширина тени
                 </div>
                 <div class="col row">
-                    <NumInput v-model="form.dualDivShadowWidth" class="col-left" :min="0" :max="100" />
+                    <NumInput v-model="form.dualDivShadowWidth" bg-color="input" class="col-left" :min="0" :max="100" />
                 </div>
             </div>
         </div>
diff --git a/client/components/Reader/SettingsPage/ViewTab/Status/Status.vue b/client/components/Reader/SettingsPage/ViewTab/Status/Status.vue
index fbc6d877..e5554350 100644
--- a/client/components/Reader/SettingsPage/ViewTab/Status/Status.vue
+++ b/client/components/Reader/SettingsPage/ViewTab/Status/Status.vue
@@ -23,6 +23,7 @@
                 <q-input
                     v-model="statusBarColorFiltered"
                     class="col-left no-mp"
+                    bg-color="input" 
                     outlined dense
                     :rules="['hexColor']"
                     style="max-width: 150px"
@@ -52,7 +53,7 @@
                 Прозрачность
             </div>
             <div class="col row">
-                <NumInput v-model="form.statusBarColorAlpha" class="col-left" :min="0" :max="1" :digits="2" :step="0.1" />
+                <NumInput v-model="form.statusBarColorAlpha" bg-color="input" class="col-left" :min="0" :max="1" :digits="2" :step="0.1" />
             </div>
         </div>
 
@@ -61,7 +62,7 @@
                 Высота
             </div>
             <div class="col row">
-                <NumInput v-model="form.statusBarHeight" class="col-left" :min="5" :max="100" />
+                <NumInput v-model="form.statusBarHeight" bg-color="input" class="col-left" :min="5" :max="100" />
             </div>
         </div>
 
diff --git a/client/components/Reader/SettingsPage/ViewTab/Text/Text.vue b/client/components/Reader/SettingsPage/ViewTab/Text/Text.vue
index 7efa1a04..7c72f8bb 100644
--- a/client/components/Reader/SettingsPage/ViewTab/Text/Text.vue
+++ b/client/components/Reader/SettingsPage/ViewTab/Text/Text.vue
@@ -10,7 +10,7 @@
                 Интервал
             </div>
             <div class="col row">
-                <NumInput v-model="form.lineInterval" class="col-left" :min="0" :max="200" />
+                <NumInput v-model="form.lineInterval" bg-color="input" class="col-left" :min="0" :max="200" />
             </div>
         </div>
 
@@ -19,7 +19,7 @@
                 Параграф
             </div>
             <div class="col row">
-                <NumInput v-model="form.p" class="col-left" :min="0" :max="2000" />
+                <NumInput v-model="form.p" bg-color="input" class="col-left" :min="0" :max="2000" />
             </div>
         </div>
 
@@ -28,7 +28,7 @@
                 Сдвиг
             </div>
             <div class="col row">
-                <NumInput v-model="form.textVertShift" class="col-left" :min="-100" :max="100">
+                <NumInput v-model="form.textVertShift" bg-color="input" class="col-left" :min="-100" :max="100">
                     <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
                         Сдвиг текста по вертикали в процентах от размера шрифта.<br>
                         Отрицательное значение сдвигает вверх, положительное -<br>
@@ -43,7 +43,7 @@
                 Скроллинг
             </div>
             <div class="col row">
-                <NumInput v-model="form.scrollingDelay" class="col-left" :min="1" :max="10000">
+                <NumInput v-model="form.scrollingDelay" bg-color="input" class="col-left" :min="1" :max="10000">
                     <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
                         Замедление скроллинга в миллисекундах.<br>
                         Определяет время, за которое текст<br>
@@ -53,7 +53,7 @@
 
                 <div class="q-px-sm" />
                 <q-select
-                    v-model="form.scrollingType" class="col" :options="['linear', 'ease', 'ease-in', 'ease-out', 'ease-in-out']"
+                    v-model="form.scrollingType" bg-color="input" class="col" :options="['linear', 'ease', 'ease-in', 'ease-out', 'ease-in-out']"
                     dropdown-icon="la la-angle-down la-sm"
                     outlined dense emit-value map-options
                 >
@@ -81,7 +81,7 @@
                 Компактность
             </div>
             <div class="q-px-sm" />
-            <NumInput v-model="form.compactTextPerc" class="col" :min="0" :max="100">
+            <NumInput v-model="form.compactTextPerc" bg-color="input" class="col" :min="0" :max="100">
                 <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
                     Степень компактности текста в процентах.<br>
                     Чем больше компактность, тем хуже выравнивание<br>
@@ -105,7 +105,7 @@
                 Добавлять пустые
             </div>
             <div class="q-px-sm" />
-            <NumInput v-model="form.addEmptyParagraphs" class="col" :min="0" :max="2" />
+            <NumInput v-model="form.addEmptyParagraphs" bg-color="input" class="col" :min="0" :max="2" />
         </div>
 
         <div class="sets-item row">
@@ -135,7 +135,7 @@
                 Высота не более
             </div>
             <div class="q-px-sm" />
-            <NumInput v-model="form.imageHeightLines" class="col" :min="1" :max="100" :disable="!form.showImages">
+            <NumInput v-model="form.imageHeightLines" bg-color="input" class="col" :min="1" :max="100" :disable="!form.showImages">
                 <q-tooltip :delay="1000" anchor="top middle" self="bottom middle" content-style="font-size: 80%">
                     Определяет высоту изображения количеством строк.<br>
                     В случае превышения высоты, изображение будет<br>