From e5d5aa9f495f36b03184e25b57838608a6edab31 Mon Sep 17 00:00:00 2001
From: Peter Mathis <peter.mathis@kombinat.at>
Date: Thu, 19 Oct 2023 15:39:47 +0200
Subject: [PATCH] fix(pat relateditems): Fix styling when inside a modal.

---
 src/pat/relateditems/relateditems.scss | 32 ++++++++++++++++++++++++++
 1 file changed, 32 insertions(+)

diff --git a/src/pat/relateditems/relateditems.scss b/src/pat/relateditems/relateditems.scss
index 568e0aa51..602fec4c4 100644
--- a/src/pat/relateditems/relateditems.scss
+++ b/src/pat/relateditems/relateditems.scss
@@ -4,11 +4,21 @@
     width: 100%;
 
     .select2-container {
+        /* generalize from .form-control */
+        border: var(--bs-border-width) solid var(--bs-border-color);
+        padding: 0.325rem 0.5rem;
         min-width: 100%;
+        border-radius: 0 0 var(--bs-border-radius) var(--bs-border-radius);
+        &.select2-dropdown-open {
+            border-radius:0;
+            border-bottom-style:none;
+        }
     }
 
+
     .toolbar {
         background-color: var(--bs-secondary-bg);
+        border-radius: var(--bs-border-radius) var(--bs-border-radius) 0 0 ;
 
         .mode-selector {
             display: inline-block;
@@ -39,6 +49,12 @@
 }
 
 .pat-relateditems-dropdown {
+
+    &.select2-drop-active {
+        border-color: var(--bs-border-color);
+        box-shadow: none;
+    }
+
     .select2-results {
         max-height: 950px;
 
@@ -92,8 +108,18 @@
 
     &.select2-container-multi {
         .select2-choices {
+            border: none;
+            background: none;
+
+            .select2-search-field input {
+                padding:0;
+            }
+
             .select2-search-choice {
                 background-image: none;
+                background-color: var(--bs-gray-100);
+                border-color:var(--bs-border-color);
+                box-shadow: none;
                 margin: 0.2em;
                 padding: 0;
                 // make choices list compact:
@@ -111,6 +137,12 @@
                 }
             }
         }
+
+        &.select2-container-active {
+            .select2-choices {
+                border:none;
+            }
+        }
     }
 }