From 051a2875b7e1ecf33f8703a6c0d79bfbeef4bb1b Mon Sep 17 00:00:00 2001
From: Joe <49767913+joebudi@users.noreply.github.com>
Date: Wed, 27 Jan 2021 09:44:58 +0000
Subject: [PATCH] Further spacing improvements

Spacing improvements
Red color applied to X hover
List of bindable objects is now scrollable without a visual of the scrollbar
---
 .../components/design/PropertiesPanel/BindingPanel.svelte  | 7 +++++++
 .../PropertyControls/EventsEditor/EventEditor.svelte       | 7 ++++++-
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/packages/builder/src/components/design/PropertiesPanel/BindingPanel.svelte b/packages/builder/src/components/design/PropertiesPanel/BindingPanel.svelte
index 7e91759764..8bfae51337 100644
--- a/packages/builder/src/components/design/PropertiesPanel/BindingPanel.svelte
+++ b/packages/builder/src/components/design/PropertiesPanel/BindingPanel.svelte
@@ -28,6 +28,7 @@
     <div class="list">
       {#if context}
         <Heading extraSmall>Columns</Heading>
+        <Spacer small />
         <ul>
           {#each context as { readableBinding }}
             <li on:click={() => addToText(readableBinding)}>
@@ -66,7 +67,13 @@
   .list {
     border-right: var(--border-light);
     padding: var(--spacing-l);
+    overflow: auto;
   }
+
+  .list::-webkit-scrollbar {
+    display: none;
+  }
+
   .text {
     padding: var(--spacing-xl);
     font-family: var(--font-sans);
diff --git a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/EventEditor.svelte b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/EventEditor.svelte
index 701e416c2f..86e5174473 100644
--- a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/EventEditor.svelte
+++ b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/EventsEditor/EventEditor.svelte
@@ -115,7 +115,7 @@
   }
 
   .actions-list {
-    border: var(--border-light);
+    border-right: var(--border-light);
     padding: var(--spacing-s);
   }
 
@@ -160,4 +160,9 @@
   a:hover {
     color: var(--blue);
   }
+
+  i:hover {
+    color: var(--red);
+    cursor: pointer;
+  }
 </style>