From 83791157ce782842df332511214855a7f99b6158 Mon Sep 17 00:00:00 2001
From: Alejandro Celaya <alejandrocelaya@gmail.com>
Date: Wed, 17 Feb 2021 11:03:42 +0100
Subject: [PATCH] Fixed inputs colors in dark theme when they are outside of
 cards

---
 src/index.scss             | 11 ++++++++++-
 src/utils/DateInput.scss   |  6 +++++-
 src/utils/DropdownBtn.scss | 13 +++++++++++--
 3 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/src/index.scss b/src/index.scss
index 691c537e..748664b3 100644
--- a/src/index.scss
+++ b/src/index.scss
@@ -44,6 +44,10 @@ body,
   background-color: var(--primary-color);
 }
 
+.list-group {
+  background-color: var(--primary-color);
+}
+
 .modal-content,
 .page-link,
 .page-item.disabled .page-link,
@@ -121,10 +125,15 @@ body,
 
 .form-control,
 .form-control:focus {
-  background-color: var(--input-color);
+  background-color: var(--primary-color);
   border-color: var(--input-border-color);
 }
 
+.card .form-control,
+.card .form-control:hover {
+  background-color: var(--input-color);
+}
+
 .navbar-brand {
   @media (max-width: $smMax) {
     margin: 0 auto !important;
diff --git a/src/utils/DateInput.scss b/src/utils/DateInput.scss
index ee27d849..6e3eb439 100644
--- a/src/utils/DateInput.scss
+++ b/src/utils/DateInput.scss
@@ -10,7 +10,11 @@
 }
 
 .date-input-container__input:not(:disabled) {
-  background-color: #ffffff !important;
+  background-color: var(--primary-color) !important;
+}
+
+.card .date-input-container__input:not(:disabled) {
+  background-color: var(--input-color) !important;
 }
 
 .date-input-container__icon {
diff --git a/src/utils/DropdownBtn.scss b/src/utils/DropdownBtn.scss
index d81c18fe..cd3161bf 100644
--- a/src/utils/DropdownBtn.scss
+++ b/src/utils/DropdownBtn.scss
@@ -6,12 +6,21 @@
 .dropdown-btn__toggle.dropdown-btn__toggle:not(:disabled):not(.disabled):focus,
 .dropdown-btn__toggle.dropdown-btn__toggle:not(:disabled):not(.disabled):hover,
 .show > .dropdown-btn__toggle.dropdown-btn__toggle.dropdown-toggle {
-  color: #6c757d;
-  background-color: var(--input-color);
   text-align: left;
+  color: #6c757d;
+  background-color: var(--primary-color);
   border-color: var(--input-border-color);
 }
 
+.card .dropdown-btn__toggle.dropdown-btn__toggle,
+.card .dropdown-btn__toggle.dropdown-btn__toggle:not(:disabled):not(.disabled).active,
+.card .dropdown-btn__toggle.dropdown-btn__toggle:not(:disabled):not(.disabled):active,
+.card .dropdown-btn__toggle.dropdown-btn__toggle:not(:disabled):not(.disabled):focus,
+.card .dropdown-btn__toggle.dropdown-btn__toggle:not(:disabled):not(.disabled):hover,
+.show > .card .dropdown-btn__toggle.dropdown-btn__toggle.dropdown-toggle {
+  background-color: var(--input-color);
+}
+
 .dropdown-btn__toggle.dropdown-btn__toggle:after {
   @include vertical-align();