[EuiTextArea] Fix missed CSS conversion that VRT tests caught 🎉

elastic · Jun 5, 2024 · 9b14b6e · 9b14b6e
1 parent 5a0ebfb
commit 9b14b6e
Show file tree

Hide file tree

Showing 5 changed files with 5 additions and 0 deletions.
diff --git a/packages/eui/.loki/reference/chrome_desktop_Forms_EuiTextArea_Icon_Shape.png b/packages/eui/.loki/reference/chrome_desktop_Forms_EuiTextArea_Icon_Shape.png
diff --git a/packages/eui/.loki/reference/chrome_desktop_Forms_EuiTextArea_Playground.png b/packages/eui/.loki/reference/chrome_desktop_Forms_EuiTextArea_Playground.png
diff --git a/packages/eui/.loki/reference/chrome_mobile_Forms_EuiTextArea_Icon_Shape.png b/packages/eui/.loki/reference/chrome_mobile_Forms_EuiTextArea_Icon_Shape.png
diff --git a/packages/eui/.loki/reference/chrome_mobile_Forms_EuiTextArea_Playground.png b/packages/eui/.loki/reference/chrome_mobile_Forms_EuiTextArea_Playground.png
diff --git a/packages/eui/src/components/form/text_area/text_area.styles.ts b/packages/eui/src/components/form/text_area/text_area.styles.ts
@@ -24,6 +24,11 @@ export const euiTextAreaStyles = (euiThemeContext: UseEuiTheme) => {
       /* Give more spacing between multiple lines */
       line-height: ${euiTheme.font.lineHeightMultiplier};
 
+      /* <textarea>s default to 'inline-block', which causes an extra 2-3px of
+       * unnecessary height within its parent 'block' form control wrapper.
+       * @see https://stackoverflow.com/a/27536461/4294462 */
+      display: block;
+
       &:invalid {
         ${formStyles.invalid}
       }