From 644d9afedabb68a0479584d42b079484a13fdf02 Mon Sep 17 00:00:00 2001
From: Christoph Anderson <37236531+lupusA@users.noreply.github.com>
Date: Sun, 12 Nov 2023 07:58:39 +0100
Subject: [PATCH] fix(ui): Minor fixes related to css (#206)

* Hints within the advanced section should now be visible
* Advanced section should now be properly themed
* Fixed light button color

---------

Co-authored-by: lupusA <lupusapps@gmail.com>
---
 src/css/App.css   | 19 +++++++++++--------
 src/css/Theme.css |  4 ++++
 2 files changed, 15 insertions(+), 8 deletions(-)

diff --git a/src/css/App.css b/src/css/App.css
index 886afb5..a61e537 100644
--- a/src/css/App.css
+++ b/src/css/App.css
@@ -37,6 +37,11 @@ body {
   border-color: var(--color-primary);
 }
 
+#kopia .btn-light {
+  background-color: var(--color-light);
+  border-color: var(--color-light);
+}
+
 #kopia .btn-secondary {
   background-color: var(--color-secondary);
   border-color: var(--color-secondary);
@@ -130,7 +135,6 @@ body {
 #kopia .form-check-input:focus,
 #kopia .accordion-button:focus {
   color: var(--color-text-body);
-  background-color: var(--background-color);
   box-shadow: 0 0 0 0.10rem var(--color-primary);
 }
 
@@ -138,12 +142,10 @@ body {
   color: var(--color-text-body);
 }
 
-#kopia .form-text {
-  color: var(--color-text-form-help)
-}
-
+#kopia .text-muted.form-text,
+#kopia .form-text,
 #kopia .form-control::placeholder {
-  color: var(--color-text-form-help);
+  color: var(--color-text-form-help) !important
 }
 
 #kopia .accordion-body,
@@ -234,8 +236,9 @@ body {
   vertical-align: middle;
 }
 
-.advancedOptions {
-  background-color: #f0f0f0;
+#kopia .advancedOptions {
+  background-color: var(--background-color);
+  color: var(--color-text-body);
   padding: 10px;
   border: 1px solid #ccc;
 }
diff --git a/src/css/Theme.css b/src/css/Theme.css
index 4d179b5..f1b5487 100644
--- a/src/css/Theme.css
+++ b/src/css/Theme.css
@@ -8,6 +8,7 @@
   --color-submit: #00B4D8;
   --color-select: #fefefe;
   --color-link: #2A7FFF;
+  --color-light: #6c757d; 
 
   --color-text: #ffffff;
   --color-text-body: #000000;
@@ -34,6 +35,7 @@
   --color-submit: #00B4D8;
   --color-select: #2c2c2c;
   --color-link: #799bd1;
+  --color-light: #6c757d; 
 
   --color-text: #cfcfcf;
   --color-text-body: #cfcfcf;
@@ -60,6 +62,7 @@
   --color-submit: #a0c4ff;
   --color-select: #fefefe;
   --color-link: #2A7FFF;
+  --color-light: #6c757d; 
   
   --color-text: #000000;
   --color-text-body: #000000;
@@ -86,6 +89,7 @@
   --color-submit: #00B4D8;
   --color-select: #fefefe;
   --color-link: #03045E;
+  --color-light: #6c757d; 
   
   --color-text: #ffffff;
   --color-text-body: #03045E;