From 44da2aba76a52ebde7772d4d636bd0ca649dfa03 Mon Sep 17 00:00:00 2001
From: Ruochen Wang <106004210+wrch0712@users.noreply.github.com>
Date: Fri, 17 Nov 2023 18:52:04 -0600
Subject: [PATCH] update background color in "state" block (#903)

* update background color in "state" block

* fix unit test failure

* fix unit test failure

Signed-off-by: Ruochen Wang <106004210+wrch0712@users.noreply.github.com>

* update test snapshot

---------

Signed-off-by: Ruochen Wang <106004210+wrch0712@users.noreply.github.com>
Co-authored-by: bowenlan-amzn <bowenlan23@gmail.com>
---
 public/pages/VisualCreatePolicy/components/States/State.tsx     | 2 +-
 .../components/States/__snapshots__/State.test.tsx.snap         | 1 -
 .../components/States/__snapshots__/States.test.tsx.snap        | 2 --
 3 files changed, 1 insertion(+), 4 deletions(-)

diff --git a/public/pages/VisualCreatePolicy/components/States/State.tsx b/public/pages/VisualCreatePolicy/components/States/State.tsx
index 47e0ce6e4..87bd87d00 100644
--- a/public/pages/VisualCreatePolicy/components/States/State.tsx
+++ b/public/pages/VisualCreatePolicy/components/States/State.tsx
@@ -102,7 +102,7 @@ const State = ({ state, isInitialState, idx, onClickEditState, onClickDeleteStat
     }
     paddingSize="l"
   >
-    <EuiFlexGroup direction="column" style={{ backgroundColor: "#f8f9fc" }}>
+    <EuiFlexGroup direction="column" gutterSize="l">
       <EuiFlexItem grow={false}>
         <EuiText>
           <h4>Actions</h4>
diff --git a/public/pages/VisualCreatePolicy/components/States/__snapshots__/State.test.tsx.snap b/public/pages/VisualCreatePolicy/components/States/__snapshots__/State.test.tsx.snap
index e602ff46a..aeade8c53 100644
--- a/public/pages/VisualCreatePolicy/components/States/__snapshots__/State.test.tsx.snap
+++ b/public/pages/VisualCreatePolicy/components/States/__snapshots__/State.test.tsx.snap
@@ -157,7 +157,6 @@ exports[`<State /> spec renders the component 1`] = `
       >
         <div
           class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
-          style="background-color: rgb(248, 249, 252);"
         >
           <div
             class="euiFlexItem euiFlexItem--flexGrowZero"
diff --git a/public/pages/VisualCreatePolicy/components/States/__snapshots__/States.test.tsx.snap b/public/pages/VisualCreatePolicy/components/States/__snapshots__/States.test.tsx.snap
index 2df7c2b78..2602b9044 100644
--- a/public/pages/VisualCreatePolicy/components/States/__snapshots__/States.test.tsx.snap
+++ b/public/pages/VisualCreatePolicy/components/States/__snapshots__/States.test.tsx.snap
@@ -281,7 +281,6 @@ exports[`<States /> spec renders the component 1`] = `
                 >
                   <div
                     class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
-                    style="background-color: rgb(248, 249, 252);"
                   >
                     <div
                       class="euiFlexItem euiFlexItem--flexGrowZero"
@@ -485,7 +484,6 @@ exports[`<States /> spec renders the component 1`] = `
                 >
                   <div
                     class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionColumn euiFlexGroup--responsive"
-                    style="background-color: rgb(248, 249, 252);"
                   >
                     <div
                       class="euiFlexItem euiFlexItem--flexGrowZero"