fix(helper-line): when hidden, it should not have any height

Lundalogik · Nov 3, 2023 · b227138 · b227138
1 parent c7dbfd7
commit b227138
Showing 1 changed file with 6 additions and 1 deletion.
diff --git a/src/components/helper-line/helper-line.scss b/src/components/helper-line/helper-line.scss
@@ -4,7 +4,6 @@
     box-sizing: border-box;
     display: grid;
 
-    padding: 0.125rem 1rem 0 1rem;
     min-width: 0; // prevents overflowing, if component is placed in flex containers
 
     font-family: Roboto, sans-serif;
@@ -23,6 +22,7 @@ div {
     justify-content: space-between;
     gap: 0.75rem;
     overflow: hidden;
+    padding: 0 1rem;
 }
 
 :host(limel-helper-line.invalid) {
@@ -36,6 +36,11 @@ div {
     margin-left: auto;
 }
 
+.helper-text,
+.counter {
+    padding-top: 0.125rem;
+}
+
 // This animates height of the helper line, from `0` to `auto`.
 // To get this animation effect, the consumer component should
 // add `hide` classed accordingly.