From 8c931af17c52e649dc8199fa0bc60ea3c61c594c Mon Sep 17 00:00:00 2001
From: Henrik Giesel <hengiesel@gmail.com>
Date: Mon, 29 Mar 2021 23:43:48 +0200
Subject: [PATCH] Make all Leaf buttons 30px high and give same vertical-align

---
 ts/editor-toolbar/ColorPicker.svelte |  2 +-
 ts/editor-toolbar/InnerButton.svelte | 14 +++++++-------
 ts/editor-toolbar/LabelButton.svelte |  6 +++++-
 3 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/ts/editor-toolbar/ColorPicker.svelte b/ts/editor-toolbar/ColorPicker.svelte
index ff02a15fd..eec03047f 100644
--- a/ts/editor-toolbar/ColorPicker.svelte
+++ b/ts/editor-toolbar/ColorPicker.svelte
@@ -8,10 +8,10 @@
 <style lang="scss">
     button {
         display: inline-block;
+        vertical-align: middle;
         width: 30px;
         height: 30px;
 
-        vertical-align: -webkit-baseline-middle;
         padding: 0;
     }
 
diff --git a/ts/editor-toolbar/InnerButton.svelte b/ts/editor-toolbar/InnerButton.svelte
index 3df207d4c..b1ba1da8b 100644
--- a/ts/editor-toolbar/InnerButton.svelte
+++ b/ts/editor-toolbar/InnerButton.svelte
@@ -1,5 +1,5 @@
 <script lang="typescript">
-    export let className: string = '';
+    export let className: string = "";
     export let onClick: (event: ClickEvent) => void;
     export let active = false;
     export let disabled = false;
@@ -8,12 +8,11 @@
 <style lang="scss">
     button {
         display: inline-block;
-
+        vertical-align: middle;
         width: 30px;
         height: 30px;
 
         background-color: white;
-        vertical-align: -webkit-baseline-middle;
 
         & > :global(svg),
         & > :global(img) {
@@ -26,7 +25,8 @@
             background-color: #eee;
         }
 
-        &:active, &.active {
+        &:active,
+        &.active {
             box-shadow: inset 0 0 10px 3px rgb(0 0 0 / 30%);
         }
 
@@ -37,7 +37,8 @@
                 background-color: white;
             }
 
-            &:active, &.active {
+            &:active,
+            &.active {
                 box-shadow: none;
             }
         }
@@ -49,7 +50,6 @@
     class:active
     {disabled}
     on:click={onClick}
-    on:mousedown|preventDefault
->
+    on:mousedown|preventDefault>
     <slot />
 </button>
diff --git a/ts/editor-toolbar/LabelButton.svelte b/ts/editor-toolbar/LabelButton.svelte
index 5271eb8ba..89c3488af 100644
--- a/ts/editor-toolbar/LabelButton.svelte
+++ b/ts/editor-toolbar/LabelButton.svelte
@@ -6,8 +6,12 @@
 
 <style lang="scss">
     button {
+        display: inline-block;
+        vertical-align: middle;
+        width: auto;
+        height: 30px;
+
         padding: 3px 10px;
-        vertical-align: -0.425em;
         margin-right: 3px;
 
         &:focus {