From 2f2cfad722fa9c3653f8575e93fa376b31ec9e36 Mon Sep 17 00:00:00 2001
From: Prabhat Khera <91852476+prabhat-org@users.noreply.github.com>
Date: Tue, 16 Jan 2024 14:32:24 +1300
Subject: [PATCH] fix high contrast theme colors (#10872)

---
 app/assets/css/vendor-override.css                   | 6 ++++++
 app/react/components/form-components/ReactSelect.css | 2 ++
 2 files changed, 8 insertions(+)

diff --git a/app/assets/css/vendor-override.css b/app/assets/css/vendor-override.css
index 731b6fbd1..92f4bac6a 100644
--- a/app/assets/css/vendor-override.css
+++ b/app/assets/css/vendor-override.css
@@ -238,6 +238,12 @@ textarea {
   background: var(--text-input-textarea);
 }
 
+[theme='highcontrast'] input,
+[theme='highcontrast'] select,
+[theme='highcontrast'] textarea {
+  border: 1px solid var(--white-color);
+}
+
 .daterangepicker {
   background-color: var(--bg-daterangepicker-color);
   border: 1px solid var(--border-daterangepicker-color);
diff --git a/app/react/components/form-components/ReactSelect.css b/app/react/components/form-components/ReactSelect.css
index e0ea54b70..29b4b94b2 100644
--- a/app/react/components/form-components/ReactSelect.css
+++ b/app/react/components/form-components/ReactSelect.css
@@ -52,6 +52,8 @@
   border-color: var(--border-form-control-color);
   background-color: var(--bg-inputbox);
   box-shadow: none;
+
+  @apply th-highcontrast:border-white;
 }
 
 /* Match the same box shadow styles as the other portainer inputs, which are inherited from the bootstrap form-control class */