From 7ee67a3fb0f2910b6e954d2e84f6c7a1c53eeef3 Mon Sep 17 00:00:00 2001
From: AndiMajore <andi.majore@googlemail.com>
Date: Thu, 29 Jul 2021 15:59:31 +0200
Subject: [PATCH] colored search bar

---
 .../network-legend.component.html             |  4 +--
 .../network-legend.component.scss             |  1 +
 src/stylesheets/theme-styles.scss             | 33 +++++++++++++++++++
 3 files changed, 36 insertions(+), 2 deletions(-)

diff --git a/src/app/components/network-legend/network-legend.component.html b/src/app/components/network-legend/network-legend.component.html
index f9d7c24b..51ce68e0 100644
--- a/src/app/components/network-legend/network-legend.component.html
+++ b/src/app/components/network-legend/network-legend.component.html
@@ -35,7 +35,7 @@
               </span>
             </th>
             <th *ngSwitchCase="'diamond'">
-              <span class="node diamond" 
+              <span class="node diamond"
                     [style.background-color]=nodeGroup.value.color.background
               >
               </span>
@@ -56,7 +56,7 @@
               <span class="node {{ nodeGroup.value.shape }}" [style.background-color]=nodeGroup.value.color.background>
               </span>
               </th>
-            <td>&nbsp;{{ nodeGroup.value.groupName }}</td>
+            <td class="group-name">&nbsp;{{ nodeGroup.value.groupName }}</td>
           </ng-container>
         </ng-container>
 
diff --git a/src/app/components/network-legend/network-legend.component.scss b/src/app/components/network-legend/network-legend.component.scss
index bcb83781..a3577934 100644
--- a/src/app/components/network-legend/network-legend.component.scss
+++ b/src/app/components/network-legend/network-legend.component.scss
@@ -13,6 +13,7 @@ div.legend {
   }
   tr.list-item{
     line-height: calc(#{$legend-row-height} / 2);
+
     th{
       height: $legend-row-height;
       width: $legend-row-height;
diff --git a/src/stylesheets/theme-styles.scss b/src/stylesheets/theme-styles.scss
index 9bec1d11..f74f3986 100644
--- a/src/stylesheets/theme-styles.scss
+++ b/src/stylesheets/theme-styles.scss
@@ -186,6 +186,39 @@
     color: var(--drgstn-text-primary)
   }
 
+  .ng-select-container, .ng-dropdown-panel.ng-select-bottom {
+    background-color: var(--drgstn-panel-secondary);
+    border-color: var(--drgstn-border);
+    .ng-value-container {
+
+      .ng-placeholder{
+        color: var(--drgstn-text-primary);
+      }
+    }
+  }
+  .ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked {
+    background-color: var(--drgstn-panel);
+    color:var(--drgstn-text-primary);
+  }
+  .ng-dropdown-panel .ng-dropdown-panel-items .ng-option {
+    background-color: var(--drgstn-panel-secondary);
+    color:var(--drgstn-text-primary);
+  }
+
+  .ng-select {
+    .ng-arrow-wrapper .ng-arrow {
+      border-top-color: var(--drgstn-text-primary);
+    }
+    .ng-clear-wrapper, .ng-select-container {
+      color: var(--drgstn-text-primary);
+    }
+  }
+
+
+  .ng-select.ng-select-opened>.ng-select-container .ng-arrow{
+    border-bottom-color: var(--drgstn-text-primary);
+  }
+
 
   ::-webkit-scrollbar {
     width: 5px;
-- 
GitLab