From d010d5aa8f07a5def1183567ee767fd144696ed3 Mon Sep 17 00:00:00 2001
From: Fabio Di Stasio <fabio286@gmail.com>
Date: Wed, 30 Nov 2022 09:15:15 +0100
Subject: [PATCH] fix(UI): wrong copnnection icons color with light theme

---
 .../components/ModalConnectionAppearence.vue         | 12 ++++++++++++
 src/renderer/components/SettingBarConnections.vue    |  1 +
 .../components/SettingBarConnectionsFolder.vue       |  1 +
 3 files changed, 14 insertions(+)

diff --git a/src/renderer/components/ModalConnectionAppearence.vue b/src/renderer/components/ModalConnectionAppearence.vue
index 3b83de50..3f63da1c 100644
--- a/src/renderer/components/ModalConnectionAppearence.vue
+++ b/src/renderer/components/ModalConnectionAppearence.vue
@@ -180,4 +180,16 @@ onBeforeUnmount(() => {
          }
      }
   }
+
+  .theme-light {
+      .icons-wrapper {
+         .dbi {
+            filter: invert(100%) opacity(.8);
+
+            &.selected {
+               outline-color: #1c96d6;
+            }
+         }
+      }
+  }
 </style>
diff --git a/src/renderer/components/SettingBarConnections.vue b/src/renderer/components/SettingBarConnections.vue
index b3ce6cea..efd3fda3 100644
--- a/src/renderer/components/SettingBarConnections.vue
+++ b/src/renderer/components/SettingBarConnections.vue
@@ -213,5 +213,6 @@ watch(() => props.modelValue, (value) => {
 
 .settingbar-element-icon {
    display: flex;
+   color: $body-font-color-dark;
 }
 </style>
diff --git a/src/renderer/components/SettingBarConnectionsFolder.vue b/src/renderer/components/SettingBarConnectionsFolder.vue
index 9138fb5e..a5960f50 100644
--- a/src/renderer/components/SettingBarConnectionsFolder.vue
+++ b/src/renderer/components/SettingBarConnectionsFolder.vue
@@ -216,6 +216,7 @@ emit('folder-sort');// To apply changes on component key change
    width: 100%;
    border-radius: 15px;
    transition: background .3s;
+   color: $body-font-color-dark;
 
    &::before {
       content: "";