From 20a067508dbafcf5c30ac26941a45ee3b56cfb7b Mon Sep 17 00:00:00 2001
From: josdejong <wjosdejong@gmail.com>
Date: Wed, 3 Jun 2020 16:00:47 +0200
Subject: [PATCH] Styling tweaks

---
 src/JSONEditor.scss | 13 ++++++++-----
 src/styles.scss     |  1 +
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/src/JSONEditor.scss b/src/JSONEditor.scss
index c28de79..7248daf 100644
--- a/src/JSONEditor.scss
+++ b/src/JSONEditor.scss
@@ -18,12 +18,13 @@
     position: relative;
 
     .button {
-      width: 32px;
-      height: 32px;
+      width: $menu-button-size;
+      height: $menu-button-size;
       border: none;
       background: transparent;
       color: white;
       cursor: pointer;
+      padding: 0;
 
       &:hover,
       &:focus {
@@ -41,11 +42,13 @@
     }
 
     .separator {
-      background: rgba(255, 255, 255, 0.2);
+      $margin: 3px;
+
+      background: rgba(255, 255, 255, 0.15);
       box-sizing: border-box;
       width: 1px;
-      height: 24px;
-      margin: 5px;
+      height: $menu-button-size - 2 * $margin;
+      margin: $margin;
     }
 
     .search-box-container {
diff --git a/src/styles.scss b/src/styles.scss
index da2bc19..39f67a7 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -27,6 +27,7 @@ $light-gray: #c0c0c0;
 
 $line-height: 18px;
 $indentation-width: 18px;
+$menu-button-size: 32px;
 $input-padding: 5px;
 $search-box-offset: 10px;
 $border-radius: 3px;