From 535d3f8466ecf5feadf1529a2c1734e2bf30a8b5 Mon Sep 17 00:00:00 2001
From: Coen Warmer <coen.warmer@gmail.com>
Date: Thu, 24 Nov 2022 09:46:19 +0100
Subject: [PATCH] Fix spacing in popovers in Rule Detail and Alert Detail as a
 result of Eui spacing updates (#146144)

Resolves https://github.com/elastic/kibana/issues/145987

## Summary

This fixes spacing in the popovers in Rule Detail and Alert Detail
header actions components.

<img width="219" alt="Screenshot 2022-11-23 at 13 09 07"
src="https://user-images.githubusercontent.com/535564/203557408-be09418e-0d6f-4416-bb0f-a301a14138c7.png">
---
 .../pages/alert_details/components/header_actions.tsx       | 2 +-
 .../observability/public/pages/rule_details/index.tsx       | 6 +-----
 2 files changed, 2 insertions(+), 6 deletions(-)

diff --git a/x-pack/plugins/observability/public/pages/alert_details/components/header_actions.tsx b/x-pack/plugins/observability/public/pages/alert_details/components/header_actions.tsx
index e7a2c773dc68f4..9b0e84da9a4ba3 100644
--- a/x-pack/plugins/observability/public/pages/alert_details/components/header_actions.tsx
+++ b/x-pack/plugins/observability/public/pages/alert_details/components/header_actions.tsx
@@ -94,7 +94,7 @@ export function HeaderActions({ alert }: HeaderActionsProps) {
           </EuiButton>
         }
       >
-        <EuiFlexGroup direction="column" alignItems="flexStart">
+        <EuiFlexGroup direction="column" alignItems="flexStart" gutterSize="s">
           <EuiButtonEmpty
             size="s"
             color="text"
diff --git a/x-pack/plugins/observability/public/pages/rule_details/index.tsx b/x-pack/plugins/observability/public/pages/rule_details/index.tsx
index 5487dba9a0195d..cc3b82f79f0473 100644
--- a/x-pack/plugins/observability/public/pages/rule_details/index.tsx
+++ b/x-pack/plugins/observability/public/pages/rule_details/index.tsx
@@ -308,21 +308,19 @@ export function RuleDetailsPage() {
                       </EuiButton>
                     }
                   >
-                    <EuiFlexGroup direction="column" alignItems="flexStart">
+                    <EuiFlexGroup direction="column" alignItems="flexStart" gutterSize="s">
                       <EuiButtonEmpty
                         data-test-subj="editRuleButton"
                         size="s"
                         iconType="pencil"
                         onClick={handleEditRule}
                       >
-                        <EuiSpacer size="s" />
                         <EuiText size="s">
                           {i18n.translate('xpack.observability.ruleDetails.editRule', {
                             defaultMessage: 'Edit rule',
                           })}
                         </EuiText>
                       </EuiButtonEmpty>
-                      <EuiSpacer size="s" />
                       <EuiButtonEmpty
                         size="s"
                         iconType="trash"
@@ -336,11 +334,9 @@ export function RuleDetailsPage() {
                           })}
                         </EuiText>
                       </EuiButtonEmpty>
-                      <EuiSpacer size="s" />
                     </EuiFlexGroup>
                   </EuiPopover>
                 </EuiFlexItem>
-                <EuiSpacer size="s" />
               </EuiFlexGroup>,
             ]
           : [],