From 7d2f1a074de905cd047f1d43abc6d1eb06c33c98 Mon Sep 17 00:00:00 2001
From: Matthias Wirth <matthias.wirth@gmail.com>
Date: Fri, 9 Apr 2021 04:56:53 +0200
Subject: [PATCH] more color adjustment for dark mode

---
 html/script.js |  4 +++-
 html/style.css | 35 +++++++++++++++++++----------------
 2 files changed, 22 insertions(+), 17 deletions(-)

diff --git a/html/script.js b/html/script.js
index 51bf064..052ace4 100644
--- a/html/script.js
+++ b/html/script.js
@@ -1816,8 +1816,9 @@ function initMap() {
             if (state) {
                 root.style.setProperty("--BGCOLOR1", '#313131');
                 root.style.setProperty("--BGCOLOR2", '#242424');
-                root.style.setProperty("--TXTCOLOR1","#D8D8D8");
+                root.style.setProperty("--TXTCOLOR1","#BFBFBF");
                 root.style.setProperty("--TXTCOLOR2","#D8D8D8");
+                root.style.setProperty("--TXTCOLOR3","#a8a8a8");
                 //invert the "x" images
                 $(".infoblockCloseBox").css('filter','invert(100%)');
                 $(".infoblockCloseBox").css(' -webkit-filter','invert(100%)');
@@ -1829,6 +1830,7 @@ function initMap() {
                 root.style.setProperty("--BGCOLOR2", '#CCCCCC');
                 root.style.setProperty("--TXTCOLOR1","#003f4b");
                 root.style.setProperty("--TXTCOLOR2","#050505");
+                root.style.setProperty("--TXTCOLOR3","#003f4b");
                 $(".infoblockCloseBox").css('filter','invert(0%)');
                 $(".infoblockCloseBox").css(' -webkit-filter','invert(0%)');
                 $(".settingsCloseBox").css('filter','invert(0%)');
diff --git a/html/style.css b/html/style.css
index bd87832..05c0808 100644
--- a/html/style.css
+++ b/html/style.css
@@ -8,6 +8,7 @@
     --FS3: calc( 17px * var(--SCALE));
     --TXTCOLOR1: #003f4b;
     --TXTCOLOR2: #050505;
+    --TXTCOLOR3: #101010;
 }
 
 html, body {
@@ -316,16 +317,23 @@ div#loader { z-index: 99; position: absolute; left: 0; top: 0; bottom: 0; right:
 .altitudeFilterInput {
     width: calc( 50px * var(--SCALE));
     height:  calc(15px * var(--SCALE));
-    background-color: var(--BGCOLOR1);
+    color:var(--TXTCOLOR2);
+    background-color: var(--BGCOLOR2);
+    border-color: var(--BGCOLOR1);
 }
 .searchInput {
     width:  calc(100px * var(--SCALE));
     height:  calc(15px * var(--SCALE));
-    background-color: var(--BGCOLOR1);
+    color:var(--TXTCOLOR2);
+    background-color: var(--BGCOLOR2);
+    border-color: var(--BGCOLOR1);
 }
 
 .formButton {
     font-size: var(--FS2);
+    color:var(--TXTCOLOR3);
+    background-color: var(--BGCOLOR2);
+    border-color: var(--BGCOLOR1);
 }
 
 select.error, textarea.error, input.error {
@@ -365,7 +373,7 @@ select.error, textarea.error, input.error {
     width: 100%;
     text-transform: uppercase;
     text-align: center;
-    color: #fff;
+    color: #e8e8e8;
     background: #003f4b;
 }
 
@@ -565,7 +573,7 @@ table.infoSectionTable tr td {
 
 .infoBlockTitleText {
     font-weight: bold;
-    color: var(--TXTCOLOR1);
+    color:var(--TXTCOLOR3);
 }
 
 
@@ -735,14 +743,6 @@ table.infoSectionTable tr td {
     border-radius: 3px;
 }
 
-.buttonFilter .ui-selected {
-    border-color: orange;
-}
-
-.buttonFilter .ui-selectee {
-    border-width: 2px;
-}
-
 .buttonFilter {
     list-style-type: none;
     margin: 0;
@@ -751,7 +751,14 @@ table.infoSectionTable tr td {
     cursor: pointer;
 }
 
+.ui-widget-content .ui-selectable .ui-selected {
+    border-color: #cc6600;
+}
+
+
 .buttonFilter li {
+    border-width: 2px;
+    border-color: var(--BGCOLOR2);
     margin-right: 5px;
     margin-bottom: 5px;
     padding: 1px;
@@ -761,10 +768,6 @@ table.infoSectionTable tr td {
     font-size: var(--FS2);
     text-align: center;
 }
-.formButton {
-    color:var(--TXTCOLOR2);
-    background-color: var(--BGCOLOR2);
-}
 
 #sortableColumns {
     list-style-type: none;