fix: line height of a single line sometimes being larger than 18px du…

…e to icons and tooltip styling
josdejong · Jul 21, 2021 · 1431160 · 1431160
1 parent e45e28b
commit 1431160
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 8 deletions.
diff --git a/src/components/modes/treemode/JSONNode.scss b/src/components/modes/treemode/JSONNode.scss
@@ -63,14 +63,10 @@
 
   .header,
   .contents {
-    display: table;
+    display: flex;
     flex-direction: row;
 
     line-height: $line-height;
-
-    > :global(*) {
-      display: table-cell;
-    }
   }
 
   .contents {
@@ -146,7 +142,6 @@
 }
 
 .expand {
-  display: table-cell;
   position: relative;
   top: 2px;
   width: $line-height;
@@ -196,9 +191,13 @@
 }
 
 .tag {
-  vertical-align: top;
   padding: 0 4px 1px;
-  margin: 2px;
+  margin: 0 2px;
+  position: relative;
+  top: 1px;
+
+  height: $line-height - 2px;
+  line-height: $line-height - 4px;
 
   background: $light-gray-transparent;
 

diff --git a/src/components/modes/treemode/ValidationError.scss b/src/components/modes/treemode/ValidationError.scss
@@ -12,3 +12,7 @@ button.validation-error {
   position: relative;
   top: 2px;
 }
+
+:global(.container) {
+  height: $line-height;
+}