From 26f464f2b373a2d54584616e3ba93df762ce29ad Mon Sep 17 00:00:00 2001
From: Alicia Sykes <sykes.alicia@gmail.com>
Date: Tue, 26 Oct 2021 22:46:35 +0100
Subject: [PATCH] :lipstick: Interactive editor style updates for Material
 Themes

---
 src/styles/color-themes.scss | 17 +++++------------
 1 file changed, 5 insertions(+), 12 deletions(-)

diff --git a/src/styles/color-themes.scss b/src/styles/color-themes.scss
index f8ebb1f1..b593b40e 100644
--- a/src/styles/color-themes.scss
+++ b/src/styles/color-themes.scss
@@ -378,6 +378,9 @@ html[data-theme='material'], html[data-theme='material-dark'] {
     margin: 0;
     padding: 0;
   }
+  .item-wrapper.add-new-item {
+    flex-grow: inherit;
+  }
   /* Custom layout for medium and large icons */
   .item-wrapper .item:not(.size-small) {
     display: flex;
@@ -520,6 +523,7 @@ html[data-theme='material'] {
   --welcome-popup-text-color: #f5f5f5;
   --footer-text-color: #f5f5f5cc;
   // --login-form-background-secondary: #f5f5f5cc;
+  --context-menu-background: #fff;
   --context-menu-secondary-color: #f5f5f5;
   --transparent-white-50: #00000080;
   --status-check-tooltip-background: #fff;
@@ -576,11 +580,6 @@ html[data-theme='material'] {
   .item:focus {
     outline-color: #4285f4cc;
   }
-  div.context-menu {
-    border: none;
-    background: var(--white);
-    ul li:hover { svg path { fill: var(--background-darker); }}
-  }
 }
 
 html[data-theme='material-dark'] {
@@ -645,6 +644,7 @@ html[data-theme='material-dark'] {
   // --minimal-view-search-color: var(--primary);
   // --minimal-view-group-color: var(--primary);
   --minimal-view-group-background: #131a1f;
+  --context-menu-secondary-color: #131a1f;
 
   div.minimal-section-heading h3, div.minimal-section-heading.selected h3 {
     color: #d5d5d5;
@@ -663,13 +663,6 @@ html[data-theme='material-dark'] {
       background: #131a1f !important;
     }
   }
-  div.context-menu {
-    border: none;
-    background: var(--background);
-    ul li:hover {
-      background: #131a1f;
-    }
-  }
 }
 
 html[data-theme='minimal-light'] {