From 9c89e45901b7d4308454a5e9b09566799fa4ea73 Mon Sep 17 00:00:00 2001
From: Tomas Van Morlegan <tomivm98@gmail.com>
Date: Wed, 15 Dec 2021 12:28:11 -0300
Subject: [PATCH] fixes to support 'Remove symbols from the output bar'

---
 .../Board/Output/SymbolOutput/SymbolOutput.css         | 10 ++++++++--
 src/components/Board/Symbol/Symbol.css                 |  5 +++++
 2 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/src/components/Board/Output/SymbolOutput/SymbolOutput.css b/src/components/Board/Output/SymbolOutput/SymbolOutput.css
index aa6a5b84f..f0027e7c4 100644
--- a/src/components/Board/Output/SymbolOutput/SymbolOutput.css
+++ b/src/components/Board/Output/SymbolOutput/SymbolOutput.css
@@ -21,7 +21,7 @@
 .LiveSymbolOutput__value {
   display: flex;
   height: 100%;
-  width: 130px;
+  width: 140px;
   padding: 3px 5px;
   align-self: flex-end;
   position: relative;
@@ -33,10 +33,16 @@
 
 .SymbolOutput__value__IconButton {
   position: absolute;
-  top: -10px;
+  --close-button-top: -10px;
+  top: var(--close-button-top);
   right: -10px;
 }
 
+.LiveSymbolOutput__value > .SymbolOutput__value__IconButton {
+  --close-button-top-live-difference: -5px;
+  top: calc(var(--close-button-top) - var(--close-button-top-live-difference));
+}
+
 .SymbolOutput__right__btns {
   display: flex;
   flex-direction: column;
diff --git a/src/components/Board/Symbol/Symbol.css b/src/components/Board/Symbol/Symbol.css
index 3f488b896..75bad2f25 100644
--- a/src/components/Board/Symbol/Symbol.css
+++ b/src/components/Board/Symbol/Symbol.css
@@ -7,6 +7,11 @@
   overflow: hidden;
   background: none;
 }
+
+.LiveSymbolOutput__value > .Symbol {
+  padding: 0.2em 0.5em 0.2em 0.5em;
+}
+
 .Symbol textarea {
   align-self: flex-start;
   font-weight: 700;