Fix share to space flyout sizing (#133949) (#133985)

(cherry picked from commit 17c2500) Co-authored-by: Joe Portner <5295965+jportner@users.noreply.github.com>
elastic · Jun 9, 2022 · 36d2e87 · 36d2e87
1 parent 768254c
commit 36d2e87
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 21 deletions.
diff --git a/x-pack/plugins/spaces/public/share_saved_objects_to_space/components/alias_table.tsx b/x-pack/plugins/spaces/public/share_saved_objects_to_space/components/alias_table.tsx
@@ -55,24 +55,26 @@ export const AliasTable: FunctionComponent<Props> = ({ spaces, aliasesToDisable
 
   return (
     <>
-      <EuiCallOut
-        size="s"
-        title={
+      <EuiFlexItem grow={false}>
+        <EuiCallOut
+          size="s"
+          title={
+            <FormattedMessage
+              id="xpack.spaces.shareToSpace.aliasTableCalloutTitle"
+              defaultMessage="Legacy URL conflict"
+            />
+          }
+          color="warning"
+        >
           <FormattedMessage
-            id="xpack.spaces.shareToSpace.aliasTableCalloutTitle"
-            defaultMessage="Legacy URL conflict"
+            id="xpack.spaces.shareToSpace.aliasTableCalloutBody"
+            defaultMessage="{aliasesToDisableCount, plural, one {# legacy URL} other {# legacy URLs}} will be disabled."
+            values={{ aliasesToDisableCount }}
           />
-        }
-        color="warning"
-      >
-        <FormattedMessage
-          id="xpack.spaces.shareToSpace.aliasTableCalloutBody"
-          defaultMessage="{aliasesToDisableCount, plural, one {# legacy URL} other {# legacy URLs}} will be disabled."
-          values={{ aliasesToDisableCount }}
-        />
-      </EuiCallOut>
+        </EuiCallOut>
 
-      <EuiSpacer size="m" />
+        <EuiSpacer size="m" />
+      </EuiFlexItem>
 
       <EuiFlexItem>
         <Suspense fallback={<EuiLoadingSpinner />}>

diff --git a/x-pack/plugins/spaces/public/share_saved_objects_to_space/components/share_mode_control.tsx b/x-pack/plugins/spaces/public/share_saved_objects_to_space/components/share_mode_control.tsx
@@ -110,7 +110,7 @@ export const ShareModeControl = (props: Props) => {
 
     const docLink = docLinks?.links.security.kibanaPrivileges;
     return (
-      <>
+      <EuiFlexItem grow={false}>
         <EuiCallOut
           size="s"
           iconType="help"
@@ -140,7 +140,7 @@ export const ShareModeControl = (props: Props) => {
         </EuiCallOut>
 
         <EuiSpacer size="m" />
-      </>
+      </EuiFlexItem>
     );
   };
 

diff --git a/x-pack/plugins/spaces/public/share_saved_objects_to_space/components/share_to_space_form.tsx b/x-pack/plugins/spaces/public/share_saved_objects_to_space/components/share_to_space_form.tsx
@@ -7,8 +7,8 @@
 
 import './share_to_space_form.scss';
 
-import { EuiCallOut, EuiLink, EuiSpacer } from '@elastic/eui';
-import React, { Fragment } from 'react';
+import { EuiCallOut, EuiFlexItem, EuiLink, EuiSpacer } from '@elastic/eui';
+import React from 'react';
 
 import { FormattedMessage } from '@kbn/i18n-react';
 
@@ -47,7 +47,7 @@ export const ShareToSpaceForm = (props: Props) => {
     onUpdate({ ...shareOptions, selectedSpaceIds });
 
   const createCopyCallout = showCreateCopyCallout ? (
-    <Fragment>
+    <EuiFlexItem grow={false}>
       <EuiCallOut
         size="s"
         title={
@@ -75,7 +75,7 @@ export const ShareToSpaceForm = (props: Props) => {
       </EuiCallOut>
 
       <EuiSpacer size="m" />
-    </Fragment>
+    </EuiFlexItem>
   ) : null;
 
   return (