From 10e11a4e9bddad8ee051ddf79205d1a1668d562a Mon Sep 17 00:00:00 2001
From: Alina Beck <alina.beck@mail.com>
Date: Tue, 27 Aug 2019 16:14:52 +0100
Subject: [PATCH] style suggestion lists

---
 webapp/components/Editor/ContextMenu.vue    | 18 +++++++++---------
 webapp/components/Editor/SuggestionList.vue |  7 ++++---
 2 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/webapp/components/Editor/ContextMenu.vue b/webapp/components/Editor/ContextMenu.vue
index e2e546a27..616686bd3 100644
--- a/webapp/components/Editor/ContextMenu.vue
+++ b/webapp/components/Editor/ContextMenu.vue
@@ -25,7 +25,7 @@ export default {
         interactive: true,
         placement,
         showOnInit,
-        theme: 'dark',
+        theme: 'human-connection',
         trigger,
         onMount(instance) {
           const input = instance.popper.querySelector('input')
@@ -65,31 +65,31 @@ export default {
 </script>
 
 <style lang="scss">
-.tippy-tooltip.dark-theme {
-  background-color: $color-neutral-0;
+.tippy-tooltip.human-connection-theme {
+  background-color: $color-primary;
   padding: 0;
   font-size: 1rem;
   text-align: inherit;
   color: $color-neutral-100;
-  border-radius: 5px;
+
   .tippy-backdrop {
     display: none;
   }
 
   .tippy-roundarrow {
-    fill: $color-neutral-0;
+    fill: $color-primary;
   }
   .tippy-popper[x-placement^='top'] & .tippy-arrow {
-    border-top-color: $color-neutral-0;
+    border-top-color: $color-primary;
   }
   .tippy-popper[x-placement^='bottom'] & .tippy-arrow {
-    border-bottom-color: $color-neutral-0;
+    border-bottom-color: $color-primary;
   }
   .tippy-popper[x-placement^='left'] & .tippy-arrow {
-    border-left-color: $color-neutral-0;
+    border-left-color: $color-primary;
   }
   .tippy-popper[x-placement^='right'] & .tippy-arrow {
-    border-right-color: $color-neutral-0;
+    border-right-color: $color-primary;
   }
 }
 </style>
diff --git a/webapp/components/Editor/SuggestionList.vue b/webapp/components/Editor/SuggestionList.vue
index f4a1966a0..b351e6b74 100644
--- a/webapp/components/Editor/SuggestionList.vue
+++ b/webapp/components/Editor/SuggestionList.vue
@@ -67,7 +67,8 @@ export default {
 .suggestion-list {
   list-style-type: none;
   padding: 0.2rem;
-  border: 2px solid rgba($color-neutral-0, 0.1);
+  border-radius: 5px;
+  border: 2px solid $color-primary;
   font-size: 0.8rem;
   font-weight: bold;
 }
@@ -84,11 +85,11 @@ export default {
 
   &.is-selected,
   &:hover {
-    background-color: rgba($color-neutral-100, 0.2);
+    background-color: rgba($color-neutral-100, 0.3);
   }
 
   &.hint {
-    opacity: 0.5;
+    opacity: 0.7;
     pointer-events: none;
   }
 }