From 92f5129994b1cf01aa25cc82bbddfcf2792e8a2c Mon Sep 17 00:00:00 2001
From: Rebecca Alpert <ralpert@redhat.com>
Date: Fri, 13 Dec 2024 10:04:50 -0500
Subject: [PATCH] Fix expanding text input spacing

---
 src/app/FlyoutForm/ExpandingTextInputs.tsx | 2 +-
 src/app/app.css                            | 6 ++++++
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/app/FlyoutForm/ExpandingTextInputs.tsx b/src/app/FlyoutForm/ExpandingTextInputs.tsx
index 055f9f5..cbd2d1f 100644
--- a/src/app/FlyoutForm/ExpandingTextInputs.tsx
+++ b/src/app/FlyoutForm/ExpandingTextInputs.tsx
@@ -53,7 +53,7 @@ export const ExpandingTextInputs: React.FunctionComponent<ExpandingTextInputsPro
         </Button>
       </div>
       {values.length > 0 && (
-        <section aria-label="Example questions" tabIndex={-1}>
+        <section className="expanding-text-input__section" aria-label="Example questions" tabIndex={-1}>
           {values.map((value, index) => {
             return (
               <div key={index} className="expanding-text-inputs__row expanding-text-input__row-with-background">
diff --git a/src/app/app.css b/src/app/app.css
index 6ae1c5d..6c627a1 100644
--- a/src/app/app.css
+++ b/src/app/app.css
@@ -552,6 +552,12 @@ pf-v6-c-page__main-container.pf-m-fill {
   position: relative;
 }
 
+.expanding-text-input__section {
+  display: flex;
+  gap: var(--pf-t--global--spacer--sm);
+  flex-direction: column;
+}
+
 .hidden {
   position: absolute;
   opacity: 0;