From 6268ee7e8c4696ddfe0aa855d6b91acbb4d2549b Mon Sep 17 00:00:00 2001
From: Caroline Horn <549577+cchaos@users.noreply.github.com>
Date: Wed, 1 May 2019 15:19:55 -0400
Subject: [PATCH] Fix some EuiFlyout and EuiModal usages (#35829)

* Fix maps layer flyout

* Fixing some flyout headers with border and size

* Using euiOverflowShadow to remove warnings

* Fixed up some regular modal usages

* Added danger colors to EuiConfirmModals where necessary
---
 .../__snapshots__/clone_modal.test.js.snap    |   8 +-
 .../public/dashboard/top_nav/clone_modal.js   |  16 +--
 .../source_filters_table.test.js.snap         |   1 +
 .../source_filters_table.js                   |   1 +
 .../__snapshots__/objects_table.test.js.snap  |  45 +++----
 .../__snapshots__/flyout.test.js.snap         | 119 ++++++++++++++----
 .../objects_table/components/flyout/flyout.js |   8 +-
 .../__snapshots__/relationships.test.js.snap  |  40 ++++--
 .../components/relationships/relationships.js |   4 +-
 .../components/objects_table/objects_table.js |  45 ++++---
 .../public/visualize/wizard/_dialog.scss      |  27 +---
 .../apply_filters/apply_filters_popover.tsx   |   2 +-
 .../components/saved_object_save_modal.tsx    |  20 +--
 .../public/sample_panel_action.tsx            |   6 +-
 .../components/tag/config_view/index.tsx      |   2 +-
 .../remove_lifecycle_confirm_modal.js         |   1 +
 .../components/detail_panel/detail_panel.js   |   2 +-
 .../source_configuration_flyout.tsx           |   2 +-
 .../public/components/layer_addpanel/view.js  |  12 +-
 .../__snapshots__/view.test.js.snap           |  54 ++++----
 .../components/layer_panel/_layer_panel.scss  |  22 ++--
 .../public/components/layer_panel/view.js     |  19 +--
 .../rule_editor_flyout.test.js.snap           |   8 +-
 .../rule_editor/rule_editor_flyout.js         |   4 +-
 .../delete_rule_modal.test.js.snap            |   2 +-
 .../select_rule_action/delete_rule_modal.js   |   1 +
 .../__snapshots__/import_modal.test.js.snap   |  24 ++--
 .../edit/import_modal/import_modal.js         |  16 +--
 .../edit/new_event_modal/new_event_modal.js   |  16 +--
 .../components/forecasting_modal/modal.js     |   2 +-
 .../report_info_button.test.tsx.snap          |  24 ++--
 .../public/components/report_info_button.tsx  |   2 +-
 32 files changed, 317 insertions(+), 238 deletions(-)

diff --git a/src/legacy/core_plugins/kibana/public/dashboard/top_nav/__snapshots__/clone_modal.test.js.snap b/src/legacy/core_plugins/kibana/public/dashboard/top_nav/__snapshots__/clone_modal.test.js.snap
index 2f454d73f3c58..213a949f7358f 100644
--- a/src/legacy/core_plugins/kibana/public/dashboard/top_nav/__snapshots__/clone_modal.test.js.snap
+++ b/src/legacy/core_plugins/kibana/public/dashboard/top_nav/__snapshots__/clone_modal.test.js.snap
@@ -11,7 +11,7 @@ exports[`renders DashboardCloneModal 1`] = `
     <EuiModalHeader>
       <EuiModalHeaderTitle>
         <FormattedMessage
-          defaultMessage="Clone Dashboard"
+          defaultMessage="Clone dashboard"
           id="kbn.dashboard.topNav.cloneModal.cloneDashboardModalHeaderTitle"
           values={Object {}}
         />
@@ -40,13 +40,11 @@ exports[`renders DashboardCloneModal 1`] = `
       />
     </EuiModalBody>
     <EuiModalFooter>
-      <EuiButton
+      <EuiButtonEmpty
         color="primary"
         data-test-subj="cloneCancelButton"
-        fill={false}
         iconSide="left"
         onClick={[Function]}
-        size="m"
         type="button"
       >
         <FormattedMessage
@@ -54,7 +52,7 @@ exports[`renders DashboardCloneModal 1`] = `
           id="kbn.dashboard.topNav.cloneModal.cancelButtonLabel"
           values={Object {}}
         />
-      </EuiButton>
+      </EuiButtonEmpty>
       <EuiButton
         color="primary"
         data-test-subj="cloneConfirmButton"
diff --git a/src/legacy/core_plugins/kibana/public/dashboard/top_nav/clone_modal.js b/src/legacy/core_plugins/kibana/public/dashboard/top_nav/clone_modal.js
index 507eb2b6db34e..757ef8dd63ad0 100644
--- a/src/legacy/core_plugins/kibana/public/dashboard/top_nav/clone_modal.js
+++ b/src/legacy/core_plugins/kibana/public/dashboard/top_nav/clone_modal.js
@@ -23,6 +23,7 @@ import { injectI18n, FormattedMessage } from '@kbn/i18n/react';
 
 import {
   EuiButton,
+  EuiButtonEmpty,
   EuiFieldText,
   EuiModal,
   EuiModalBody,
@@ -90,10 +91,12 @@ class DashboardCloneModalUi extends React.Component {
 
     return (
       <Fragment>
+        <EuiSpacer />
         <EuiCallOut
+          size="s"
           title={this.props.intl.formatMessage({
             id: 'kbn.dashboard.topNav.cloneModal.dashboardExistsTitle',
-            defaultMessage: 'A Dashboard with the title {newDashboardName} already exists.',
+            defaultMessage: 'A dashboard with the title {newDashboardName} already exists.',
           }, {
             newDashboardName: `'${this.state.newDashboardName}'`,
           })}
@@ -117,7 +120,6 @@ class DashboardCloneModalUi extends React.Component {
             />
           </p>
         </EuiCallOut>
-        <EuiSpacer />
       </Fragment>
     );
   }
@@ -134,7 +136,7 @@ class DashboardCloneModalUi extends React.Component {
             <EuiModalHeaderTitle>
               <FormattedMessage
                 id="kbn.dashboard.topNav.cloneModal.cloneDashboardModalHeaderTitle"
-                defaultMessage="Clone Dashboard"
+                defaultMessage="Clone dashboard"
               />
             </EuiModalHeaderTitle>
           </EuiModalHeader>
@@ -151,8 +153,6 @@ class DashboardCloneModalUi extends React.Component {
 
             <EuiSpacer />
 
-            {this.renderDuplicateTitleCallout()}
-
             <EuiFieldText
               autoFocus
               data-test-subj="clonedDashboardTitle"
@@ -161,10 +161,12 @@ class DashboardCloneModalUi extends React.Component {
               isInvalid={this.state.hasTitleDuplicate}
             />
 
+            {this.renderDuplicateTitleCallout()}
+
           </EuiModalBody>
 
           <EuiModalFooter>
-            <EuiButton
+            <EuiButtonEmpty
               data-test-subj="cloneCancelButton"
               onClick={this.props.onClose}
             >
@@ -172,7 +174,7 @@ class DashboardCloneModalUi extends React.Component {
                 id="kbn.dashboard.topNav.cloneModal.cancelButtonLabel"
                 defaultMessage="Cancel"
               />
-            </EuiButton>
+            </EuiButtonEmpty>
 
             <EuiButton
               fill
diff --git a/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/source_filters_table/__jest__/__snapshots__/source_filters_table.test.js.snap b/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/source_filters_table/__jest__/__snapshots__/source_filters_table.test.js.snap
index b99d2d3d0b141..03fe9f058013f 100644
--- a/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/source_filters_table/__jest__/__snapshots__/source_filters_table.test.js.snap
+++ b/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/source_filters_table/__jest__/__snapshots__/source_filters_table.test.js.snap
@@ -267,6 +267,7 @@ exports[`SourceFiltersTable should show a delete modal 1`] = `
   />
   <eui-overlay-mask>
     <eui-confirm-modal
+      buttonColor="danger"
       cancelButtonText={
         <FormattedMessage
           defaultMessage="Cancel"
diff --git a/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/source_filters_table/source_filters_table.js b/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/source_filters_table/source_filters_table.js
index 8ae3ef7e9fd22..ba93485a1739a 100644
--- a/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/source_filters_table/source_filters_table.js
+++ b/src/legacy/core_plugins/kibana/public/management/sections/index_patterns/edit_index_pattern/source_filters_table/source_filters_table.js
@@ -175,6 +175,7 @@ export class SourceFiltersTable extends Component {
             id="kbn.management.editIndexPattern.source.deleteFilter.cancelButtonLabel"
             defaultMessage="Cancel"
           />}
+          buttonColor="danger"
           confirmButtonText={<FormattedMessage
             id="kbn.management.editIndexPattern.source.deleteFilter.deleteButtonLabel"
             defaultMessage="Delete"
diff --git a/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/__jest__/__snapshots__/objects_table.test.js.snap b/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/__jest__/__snapshots__/objects_table.test.js.snap
index 63f4a6a185a92..54f5a33f93ade 100644
--- a/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/__jest__/__snapshots__/objects_table.test.js.snap
+++ b/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/__jest__/__snapshots__/objects_table.test.js.snap
@@ -2,7 +2,7 @@
 
 exports[`ObjectsTable delete should show a confirm modal 1`] = `
 <EuiConfirmModal
-  buttonColor="primary"
+  buttonColor="danger"
   cancelButtonText={
     <FormattedMessage
       defaultMessage="Cancel"
@@ -95,14 +95,19 @@ exports[`ObjectsTable export should allow the user to choose when exporting all
     </EuiModalHeaderTitle>
   </EuiModalHeader>
   <EuiModalBody>
-    <EuiText>
-      <p>
+    <EuiFormRow
+      describedByIds={Array []}
+      fullWidth={false}
+      hasEmptyLabelSpace={false}
+      label={
         <FormattedMessage
-          defaultMessage="Select which types to export."
+          defaultMessage="Select which types to export"
           id="kbn.management.objects.objectsTable.exportObjectsConfirmModalDescription"
           values={Object {}}
         />
-      </p>
+      }
+      labelType="legend"
+    >
       <EuiCheckboxGroup
         idToSelectedMap={
           Object {
@@ -134,26 +139,24 @@ exports[`ObjectsTable export should allow the user to choose when exporting all
           ]
         }
       />
-    </EuiText>
+    </EuiFormRow>
+    <EuiSwitch
+      checked={true}
+      label={
+        <FormattedMessage
+          defaultMessage="Include related objects"
+          id="kbn.management.objects.objectsTable.exportObjectsConfirmModal.includeReferencesDeepLabel"
+          values={Object {}}
+        />
+      }
+      name="includeReferencesDeep"
+      onChange={[Function]}
+    />
   </EuiModalBody>
   <EuiModalFooter>
     <EuiFlexGroup
-      justifyContent="spaceBetween"
+      justifyContent="flexEnd"
     >
-      <EuiFlexItem>
-        <EuiSwitch
-          checked={true}
-          label={
-            <FormattedMessage
-              defaultMessage="Include related objects"
-              id="kbn.management.objects.objectsTable.exportObjectsConfirmModal.includeReferencesDeepLabel"
-              values={Object {}}
-            />
-          }
-          name="includeReferencesDeep"
-          onChange={[Function]}
-        />
-      </EuiFlexItem>
       <EuiFlexItem
         grow={false}
       >
diff --git a/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/flyout/__jest__/__snapshots__/flyout.test.js.snap b/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/flyout/__jest__/__snapshots__/flyout.test.js.snap
index 0dbaf3fe5e9f2..18298e9ddab16 100644
--- a/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/flyout/__jest__/__snapshots__/flyout.test.js.snap
+++ b/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/flyout/__jest__/__snapshots__/flyout.test.js.snap
@@ -9,8 +9,12 @@ exports[`Flyout conflicts should allow conflict resolution 1`] = `
   ownFocus={false}
   size="s"
 >
-  <EuiFlyoutHeader>
-    <EuiTitle>
+  <EuiFlyoutHeader
+    hasBorder={true}
+  >
+    <EuiTitle
+      size="m"
+    >
       <h2>
         <FormattedMessage
           defaultMessage="Import saved objects"
@@ -19,6 +23,8 @@ exports[`Flyout conflicts should allow conflict resolution 1`] = `
         />
       </h2>
     </EuiTitle>
+  </EuiFlyoutHeader>
+  <EuiFlyoutBody>
     <span>
       <EuiSpacer
         size="s"
@@ -58,8 +64,6 @@ exports[`Flyout conflicts should allow conflict resolution 1`] = `
         </p>
       </EuiCallOut>
     </span>
-  </EuiFlyoutHeader>
-  <EuiFlyoutBody>
     <EuiInMemoryTable
       columns={
         Array [
@@ -278,8 +282,12 @@ exports[`Flyout legacy conflicts should allow conflict resolution 1`] = `
   ownFocus={false}
   size="s"
 >
-  <EuiFlyoutHeader>
-    <EuiTitle>
+  <EuiFlyoutHeader
+    hasBorder={true}
+  >
+    <EuiTitle
+      size="m"
+    >
       <h2>
         <FormattedMessage
           defaultMessage="Import saved objects"
@@ -288,6 +296,8 @@ exports[`Flyout legacy conflicts should allow conflict resolution 1`] = `
         />
       </h2>
     </EuiTitle>
+  </EuiFlyoutHeader>
+  <EuiFlyoutBody>
     <span>
       <EuiSpacer
         size="s"
@@ -352,8 +362,6 @@ exports[`Flyout legacy conflicts should allow conflict resolution 1`] = `
         </p>
       </EuiCallOut>
     </span>
-  </EuiFlyoutHeader>
-  <EuiFlyoutBody>
     <EuiInMemoryTable
       columns={
         Array [
@@ -458,22 +466,77 @@ exports[`Flyout legacy conflicts should allow conflict resolution 1`] = `
 `;
 
 exports[`Flyout legacy conflicts should handle errors 1`] = `
-<EuiCallOut
-  color="danger"
-  iconType="cross"
-  size="m"
-  title={
-    <FormattedMessage
-      defaultMessage="Sorry, there was an error"
-      id="kbn.management.objects.objectsTable.flyout.errorCalloutTitle"
-      values={Object {}}
-    />
-  }
->
-  <p>
-    foobar
-  </p>
-</EuiCallOut>
+Array [
+  <EuiCallOut
+    color="warning"
+    iconType="help"
+    size="m"
+    title={
+      <FormattedMessage
+        defaultMessage="Support for JSON files is going away"
+        id="kbn.management.objects.objectsTable.flyout.legacyFileUsedTitle"
+        values={Object {}}
+      />
+    }
+  >
+    <p>
+      <FormattedMessage
+        defaultMessage="Use our updated export to generate NDJSON files, and you'll be all set."
+        id="kbn.management.objects.objectsTable.flyout.legacyFileUsedBody"
+        values={Object {}}
+      />
+    </p>
+  </EuiCallOut>,
+  <EuiCallOut
+    color="warning"
+    iconType="help"
+    size="m"
+    title={
+      <FormattedMessage
+        defaultMessage="Index Pattern Conflicts"
+        id="kbn.management.objects.objectsTable.flyout.indexPatternConflictsTitle"
+        values={Object {}}
+      />
+    }
+  >
+    <p>
+      <FormattedMessage
+        defaultMessage="The following saved objects use index patterns that do not exist. Please select the index patterns you'd like re-associated with them. You can {indexPatternLink} if necessary."
+        id="kbn.management.objects.objectsTable.flyout.indexPatternConflictsDescription"
+        values={
+          Object {
+            "indexPatternLink": <EuiLink
+              color="primary"
+              href=""
+              type="button"
+            >
+              <FormattedMessage
+                defaultMessage="create a new index pattern"
+                id="kbn.management.objects.objectsTable.flyout.indexPatternConflictsCalloutLinkText"
+                values={Object {}}
+              />
+            </EuiLink>,
+          }
+        }
+      />
+    </p>
+  </EuiCallOut>,
+  <EuiCallOut
+    color="danger"
+    size="m"
+    title={
+      <FormattedMessage
+        defaultMessage="Sorry, there was an error"
+        id="kbn.management.objects.objectsTable.flyout.errorCalloutTitle"
+        values={Object {}}
+      />
+    }
+  >
+    <p>
+      foobar
+    </p>
+  </EuiCallOut>,
+]
 `;
 
 exports[`Flyout should render import step 1`] = `
@@ -485,8 +548,12 @@ exports[`Flyout should render import step 1`] = `
   ownFocus={false}
   size="s"
 >
-  <EuiFlyoutHeader>
-    <EuiTitle>
+  <EuiFlyoutHeader
+    hasBorder={true}
+  >
+    <EuiTitle
+      size="m"
+    >
       <h2>
         <FormattedMessage
           defaultMessage="Import saved objects"
diff --git a/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/flyout/flyout.js b/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/flyout/flyout.js
index 83f6acd70d10b..0d47153669a5f 100644
--- a/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/flyout/flyout.js
+++ b/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/flyout/flyout.js
@@ -533,7 +533,6 @@ class FlyoutUI extends Component {
             <FormattedMessage id="kbn.management.objects.objectsTable.flyout.errorCalloutTitle" defaultMessage="Sorry, there was an error"/>
           )}
           color="danger"
-          iconType="cross"
         >
           <p>{error}</p>
         </EuiCallOut>
@@ -879,6 +878,7 @@ class FlyoutUI extends Component {
                 defaultMessage: 'Overwrite',
               },
             )}
+            buttonColor="danger"
             onCancel={this.overwriteSkipped.bind(this)}
             onConfirm={this.overwriteConfirmed.bind(this)}
             defaultFocusedButton={EUI_MODAL_CONFIRM_BUTTON}
@@ -896,8 +896,8 @@ class FlyoutUI extends Component {
 
     return (
       <EuiFlyout onClose={close} size="s">
-        <EuiFlyoutHeader>
-          <EuiTitle>
+        <EuiFlyoutHeader hasBorder>
+          <EuiTitle size="m">
             <h2>
               <FormattedMessage
                 id="kbn.management.objects.objectsTable.flyout.importSavedObjectTitle"
@@ -905,10 +905,10 @@ class FlyoutUI extends Component {
               />
             </h2>
           </EuiTitle>
-          {this.renderSubheader()}
         </EuiFlyoutHeader>
 
         <EuiFlyoutBody>
+          {this.renderSubheader()}
           {this.renderError()}
           {this.renderBody()}
         </EuiFlyoutBody>
diff --git a/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/relationships/__jest__/__snapshots__/relationships.test.js.snap b/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/relationships/__jest__/__snapshots__/relationships.test.js.snap
index d4c0d6f44454a..9fcbce0f72725 100644
--- a/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/relationships/__jest__/__snapshots__/relationships.test.js.snap
+++ b/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/relationships/__jest__/__snapshots__/relationships.test.js.snap
@@ -9,8 +9,12 @@ exports[`Relationships should render dashboards normally 1`] = `
   ownFocus={false}
   size="m"
 >
-  <EuiFlyoutHeader>
-    <EuiTitle>
+  <EuiFlyoutHeader
+    hasBorder={true}
+  >
+    <EuiTitle
+      size="m"
+    >
       <h2>
         <EuiToolTip
           content="dashboard"
@@ -113,8 +117,12 @@ exports[`Relationships should render errors 1`] = `
   ownFocus={false}
   size="m"
 >
-  <EuiFlyoutHeader>
-    <EuiTitle>
+  <EuiFlyoutHeader
+    hasBorder={true}
+  >
+    <EuiTitle
+      size="m"
+    >
       <h2>
         <EuiToolTip
           content="dashboard"
@@ -159,8 +167,12 @@ exports[`Relationships should render index patterns normally 1`] = `
   ownFocus={false}
   size="m"
 >
-  <EuiFlyoutHeader>
-    <EuiTitle>
+  <EuiFlyoutHeader
+    hasBorder={true}
+  >
+    <EuiTitle
+      size="m"
+    >
       <h2>
         <EuiToolTip
           content="index patterns"
@@ -314,8 +326,12 @@ exports[`Relationships should render searches normally 1`] = `
   ownFocus={false}
   size="m"
 >
-  <EuiFlyoutHeader>
-    <EuiTitle>
+  <EuiFlyoutHeader
+    hasBorder={true}
+  >
+    <EuiTitle
+      size="m"
+    >
       <h2>
         <EuiToolTip
           content="search"
@@ -481,8 +497,12 @@ exports[`Relationships should render visualizations normally 1`] = `
   ownFocus={false}
   size="m"
 >
-  <EuiFlyoutHeader>
-    <EuiTitle>
+  <EuiFlyoutHeader
+    hasBorder={true}
+  >
+    <EuiTitle
+      size="m"
+    >
       <h2>
         <EuiToolTip
           content="visualization"
diff --git a/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/relationships/relationships.js b/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/relationships/relationships.js
index 4a46e46b3539d..8e79cd1c153fb 100644
--- a/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/relationships/relationships.js
+++ b/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/relationships/relationships.js
@@ -290,8 +290,8 @@ class RelationshipsUI extends Component {
 
     return (
       <EuiFlyout onClose={close}>
-        <EuiFlyoutHeader>
-          <EuiTitle>
+        <EuiFlyoutHeader hasBorder>
+          <EuiTitle size="m">
             <h2>
               <EuiToolTip position="top" content={getSavedObjectLabel(type)}>
                 <EuiIcon
diff --git a/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/objects_table.js b/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/objects_table.js
index decef766ce779..59f3ffbcc9e6b 100644
--- a/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/objects_table.js
+++ b/src/legacy/core_plugins/kibana/public/management/sections/objects/components/objects_table/objects_table.js
@@ -47,7 +47,7 @@ import {
   EuiButtonEmpty,
   EuiButton,
   EuiModalHeaderTitle,
-  EuiText,
+  EuiFormRow,
   EuiFlexGroup,
   EuiFlexItem
 } from '@elastic/eui';
@@ -474,6 +474,7 @@ class ObjectsTableUI extends Component {
           }
           onCancel={onCancel}
           onConfirm={onConfirm}
+          buttonColor="danger"
           cancelButtonText={(
             <FormattedMessage
               id="kbn.management.objects.objectsTable.deleteSavedObjectsConfirmModal.cancelButtonLabel"
@@ -585,13 +586,13 @@ class ObjectsTableUI extends Component {
             </EuiModalHeaderTitle>
           </EuiModalHeader>
           <EuiModalBody>
-            <EuiText>
-              <p>
-                <FormattedMessage
-                  id="kbn.management.objects.objectsTable.exportObjectsConfirmModalDescription"
-                  defaultMessage="Select which types to export."
-                />
-              </p>
+            <EuiFormRow
+              label={<FormattedMessage
+                id="kbn.management.objects.objectsTable.exportObjectsConfirmModalDescription"
+                defaultMessage="Select which types to export"
+              />}
+              labelType="legend"
+            >
               <EuiCheckboxGroup
                 options={exportAllOptions}
                 idToSelectedMap={exportAllSelectedOptions}
@@ -608,23 +609,21 @@ class ObjectsTableUI extends Component {
                   });
                 }}
               />
-            </EuiText>
+            </EuiFormRow>
+            <EuiSwitch
+              name="includeReferencesDeep"
+              label={(
+                <FormattedMessage
+                  id="kbn.management.objects.objectsTable.exportObjectsConfirmModal.includeReferencesDeepLabel"
+                  defaultMessage="Include related objects"
+                />
+              )}
+              checked={isIncludeReferencesDeepChecked}
+              onChange={this.changeIncludeReferencesDeep}
+            />
           </EuiModalBody>
           <EuiModalFooter>
-            <EuiFlexGroup justifyContent="spaceBetween">
-              <EuiFlexItem>
-                <EuiSwitch
-                  name="includeReferencesDeep"
-                  label={(
-                    <FormattedMessage
-                      id="kbn.management.objects.objectsTable.exportObjectsConfirmModal.includeReferencesDeepLabel"
-                      defaultMessage="Include related objects"
-                    />
-                  )}
-                  checked={isIncludeReferencesDeepChecked}
-                  onChange={this.changeIncludeReferencesDeep}
-                />
-              </EuiFlexItem>
+            <EuiFlexGroup justifyContent="flexEnd">
               <EuiFlexItem grow={false}>
                 <EuiFlexGroup>
                   <EuiFlexItem grow={false}>
diff --git a/src/legacy/core_plugins/kibana/public/visualize/wizard/_dialog.scss b/src/legacy/core_plugins/kibana/public/visualize/wizard/_dialog.scss
index 829c18c3644f0..3f6b9d3c4b789 100644
--- a/src/legacy/core_plugins/kibana/public/visualize/wizard/_dialog.scss
+++ b/src/legacy/core_plugins/kibana/public/visualize/wizard/_dialog.scss
@@ -25,32 +25,11 @@
 }
 
 .visNewVisDialog__typesWrapper {
+  @include euiOverflowShadow;
   max-width: $euiSizeXXL * 10;
   min-height: 0;
-  padding-top: 2px; // Account for search field dropshadow
-  padding-bottom: $euiSize;
-  // Add overflow shadows via pseudo elements
-  position: relative;
-  &::before,
-  &::after {
-    content: "";
-    display: block;
-    position: absolute;
-    height: $euiSizeXXL;
-    left: 0;
-    right: 0;
-    pointer-events: none;
-  }
-
-  &::before {
-    top: -$euiSizeXXL + 2px; // Account for search field dropshadow
-    @include euiOverflowShadowBottom;
-  }
-
-  &::after {
-    bottom: -$euiSizeL;
-    @include euiOverflowShadowTop;
-  }
+  margin-top: 2px; // Account for search field dropshadow
+  overflow: hidden;
 }
 
 .visNewVisDialog__types {
diff --git a/src/legacy/ui/public/apply_filters/apply_filters_popover.tsx b/src/legacy/ui/public/apply_filters/apply_filters_popover.tsx
index 67f78b0951f19..3b02eacdc6d25 100644
--- a/src/legacy/ui/public/apply_filters/apply_filters_popover.tsx
+++ b/src/legacy/ui/public/apply_filters/apply_filters_popover.tsx
@@ -100,7 +100,7 @@ export class ApplyFiltersPopover extends Component<Props, State> {
             <EuiButton onClick={this.onSubmit} fill>
               <FormattedMessage
                 id="common.ui.applyFiltersPopup.saveButtonLabel"
-                defaultMessage="Save"
+                defaultMessage="Apply"
               />
             </EuiButton>
           </EuiModalFooter>
diff --git a/src/legacy/ui/public/saved_objects/components/saved_object_save_modal.tsx b/src/legacy/ui/public/saved_objects/components/saved_object_save_modal.tsx
index c79b0dca0d9b3..e744ac72430f4 100644
--- a/src/legacy/ui/public/saved_objects/components/saved_object_save_modal.tsx
+++ b/src/legacy/ui/public/saved_objects/components/saved_object_save_modal.tsx
@@ -242,21 +242,21 @@ export class SavedObjectSaveModal extends React.Component<Props, State> {
     }
 
     return (
-      <EuiFormRow
-        label={
-          <FormattedMessage
-            id="common.ui.savedObjects.saveModal.saveAsNewLabel"
-            defaultMessage="Save as a new {objectType}"
-            values={{ objectType: this.props.objectType }}
-          />
-        }
-      >
+      <Fragment>
         <EuiSwitch
           data-test-subj="saveAsNewCheckbox"
           checked={this.state.copyOnSave}
           onChange={this.onCopyOnSaveChange}
+          label={
+            <FormattedMessage
+              id="common.ui.savedObjects.saveModal.saveAsNewLabel"
+              defaultMessage="Save as a new {objectType}"
+              values={{ objectType: this.props.objectType }}
+            />
+          }
         />
-      </EuiFormRow>
+        <EuiSpacer />
+      </Fragment>
     );
   };
 }
diff --git a/test/plugin_functional/plugins/kbn_tp_sample_panel_action/public/sample_panel_action.tsx b/test/plugin_functional/plugins/kbn_tp_sample_panel_action/public/sample_panel_action.tsx
index 3f04adc11a418..528bf16292f7c 100644
--- a/test/plugin_functional/plugins/kbn_tp_sample_panel_action/public/sample_panel_action.tsx
+++ b/test/plugin_functional/plugins/kbn_tp_sample_panel_action/public/sample_panel_action.tsx
@@ -41,12 +41,12 @@ class SamplePanelAction extends ContextMenuAction {
     getNewPlatform().start.core.overlays.openFlyout(
       <React.Fragment>
         <EuiFlyoutHeader>
-          <EuiTitle size="s" data-test-subj="samplePanelActionTitle">
-            <h1>{embeddable.metadata.title}</h1>
+          <EuiTitle size="m" data-test-subj="samplePanelActionTitle">
+            <h2>{embeddable.metadata.title}</h2>
           </EuiTitle>
         </EuiFlyoutHeader>
         <EuiFlyoutBody>
-          <h1 data-test-subj="samplePanelActionBody">This is a sample action</h1>
+          <h3 data-test-subj="samplePanelActionBody">This is a sample action</h3>
         </EuiFlyoutBody>
       </React.Fragment>,
       {
diff --git a/x-pack/plugins/beats_management/public/components/tag/config_view/index.tsx b/x-pack/plugins/beats_management/public/components/tag/config_view/index.tsx
index f069b65223d5f..fe505eb8207d9 100644
--- a/x-pack/plugins/beats_management/public/components/tag/config_view/index.tsx
+++ b/x-pack/plugins/beats_management/public/components/tag/config_view/index.tsx
@@ -72,7 +72,7 @@ class ConfigViewUi extends React.Component<ComponentProps, ComponentState> {
     }
     return (
       <EuiFlyout onClose={this.props.onClose}>
-        <EuiFlyoutHeader>
+        <EuiFlyoutHeader hasBorder>
           <EuiTitle size="m">
             <h2>
               {this.editMode
diff --git a/x-pack/plugins/index_lifecycle_management/public/extend_index_management/components/remove_lifecycle_confirm_modal.js b/x-pack/plugins/index_lifecycle_management/public/extend_index_management/components/remove_lifecycle_confirm_modal.js
index 67d9c37e556f2..5a1f7f56ab51e 100644
--- a/x-pack/plugins/index_lifecycle_management/public/extend_index_management/components/remove_lifecycle_confirm_modal.js
+++ b/x-pack/plugins/index_lifecycle_management/public/extend_index_management/components/remove_lifecycle_confirm_modal.js
@@ -99,6 +99,7 @@ export class RemoveLifecyclePolicyConfirmModal extends Component {
               defaultMessage="Cancel"
             />
           }
+          buttonColor="danger"
           confirmButtonText={
             <FormattedMessage
               id="xpack.indexLifecycleMgmt.indexManagementTable.removeLifecyclePolicyConfirmModal.removePolicyButtonText"
diff --git a/x-pack/plugins/index_management/public/sections/index_list/components/detail_panel/detail_panel.js b/x-pack/plugins/index_management/public/sections/index_list/components/detail_panel/detail_panel.js
index ea131164b49dd..a96cfdb12db0a 100644
--- a/x-pack/plugins/index_management/public/sections/index_list/components/detail_panel/detail_panel.js
+++ b/x-pack/plugins/index_management/public/sections/index_list/components/detail_panel/detail_panel.js
@@ -167,7 +167,7 @@ export class DetailPanel extends Component {
         aria-labelledby="indexDetailsFlyoutTitle"
       >
         <EuiFlyoutHeader>
-          <EuiTitle size="l" id="indexDetailsFlyoutTitle">
+          <EuiTitle id="indexDetailsFlyoutTitle">
             <h2>{indexName}{renderBadges(index)}</h2>
           </EuiTitle>
           {index ? <EuiTabs>{this.renderTabs()}</EuiTabs> : null }
diff --git a/x-pack/plugins/infra/public/components/source_configuration/source_configuration_flyout.tsx b/x-pack/plugins/infra/public/components/source_configuration/source_configuration_flyout.tsx
index d5f3e0f3ada88..a49e7461a3fea 100644
--- a/x-pack/plugins/infra/public/components/source_configuration/source_configuration_flyout.tsx
+++ b/x-pack/plugins/infra/public/components/source_configuration/source_configuration_flyout.tsx
@@ -102,7 +102,7 @@ export const SourceConfigurationFlyout: React.FunctionComponent<
       hideCloseButton
       onClose={noop}
     >
-      <EuiFlyoutHeader>
+      <EuiFlyoutHeader hasBorder>
         <EuiTitle>
           <h2 id="sourceConfigurationTitle">
             {shouldAllowEdit ? (
diff --git a/x-pack/plugins/maps/public/components/layer_addpanel/view.js b/x-pack/plugins/maps/public/components/layer_addpanel/view.js
index fa20d7e63726d..6af578ee5860f 100644
--- a/x-pack/plugins/maps/public/components/layer_addpanel/view.js
+++ b/x-pack/plugins/maps/public/components/layer_addpanel/view.js
@@ -17,7 +17,6 @@ import {
   EuiCard,
   EuiIcon,
   EuiFlyoutHeader,
-  EuiFlyoutBody,
   EuiFlyoutFooter,
 } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n/react';
@@ -182,12 +181,11 @@ export class AddLayerPanel extends Component {
           </EuiTitle>
         </EuiFlyoutHeader>
 
-        <EuiFlyoutBody
-          className="mapLayerPanel__body"
-          data-test-subj="layerAddForm"
-        >
-          {this._renderAddLayerForm()}
-        </EuiFlyoutBody>
+        <div className="mapLayerPanel__body" data-test-subj="layerAddForm">
+          <div className="mapLayerPanel__bodyOverflow">
+            {this._renderAddLayerForm()}
+          </div>
+        </div>
 
         <EuiFlyoutFooter className="mapLayerPanel__footer">
           <EuiFlexGroup justifyContent="spaceBetween" responsive={false}>
diff --git a/x-pack/plugins/maps/public/components/layer_panel/__snapshots__/view.test.js.snap b/x-pack/plugins/maps/public/components/layer_panel/__snapshots__/view.test.js.snap
index 7143b45311ee6..7faa589c303a8 100644
--- a/x-pack/plugins/maps/public/components/layer_panel/__snapshots__/view.test.js.snap
+++ b/x-pack/plugins/maps/public/components/layer_panel/__snapshots__/view.test.js.snap
@@ -77,35 +77,39 @@ exports[`LayerPanel is rendered 1`] = `
       </EuiAccordion>
     </div>
   </EuiFlyoutHeader>
-  <EuiFlyoutBody
+  <div
     className="mapLayerPanel__body"
   >
-    <LayerErrors />
-    <LayerSettings />
-    <SourceSettings />
-    <EuiPanel
-      grow={true}
-      hasShadow={false}
-      paddingSize="m"
+    <div
+      className="mapLayerPanel__bodyOverflow"
     >
-      <JoinEditor />
-    </EuiPanel>
-    <EuiSpacer
-      size="s"
-    />
-    <StyleTabs
-      layer={
-        Object {
-          "getDisplayName": [Function],
-          "getId": [Function],
-          "getImmutableSourceProperties": [Function],
-          "getLayerTypeIconName": [Function],
-          "isJoinable": [Function],
-          "supportsElasticsearchFilters": [Function],
+      <LayerErrors />
+      <LayerSettings />
+      <SourceSettings />
+      <EuiPanel
+        grow={true}
+        hasShadow={false}
+        paddingSize="m"
+      >
+        <JoinEditor />
+      </EuiPanel>
+      <EuiSpacer
+        size="s"
+      />
+      <StyleTabs
+        layer={
+          Object {
+            "getDisplayName": [Function],
+            "getId": [Function],
+            "getImmutableSourceProperties": [Function],
+            "getLayerTypeIconName": [Function],
+            "isJoinable": [Function],
+            "supportsElasticsearchFilters": [Function],
+          }
         }
-      }
-    />
-  </EuiFlyoutBody>
+      />
+    </div>
+  </div>
   <EuiFlyoutFooter
     className="mapLayerPanel__footer"
   >
diff --git a/x-pack/plugins/maps/public/components/layer_panel/_layer_panel.scss b/x-pack/plugins/maps/public/components/layer_panel/_layer_panel.scss
index c003a875733e3..b7c426bc90bc7 100644
--- a/x-pack/plugins/maps/public/components/layer_panel/_layer_panel.scss
+++ b/x-pack/plugins/maps/public/components/layer_panel/_layer_panel.scss
@@ -5,22 +5,27 @@
  */
 
 .mapLayerPanel__header,
-.mapLayerPanel__body,
 .mapLayerPanel__footer {
   padding: $euiSize;
 }
 
 .mapLayerPanel__body {
-  flex-basis: 1px; /* Fixes scrolling for Firefox */
+  @include euiOverflowShadow($euiPageBackgroundColor);
   padding-bottom: 0; /* 1 */
+  flex-grow: 1;
+  flex-basis: 1px; /* Fixes scrolling for Firefox */
+  overflow-y: hidden;
 
-  > *:last-child {
-    margin-bottom: $euiSize; /* 1 */
-  }
-}
+  .mapLayerPanel__bodyOverflow {
+    @include euiScrollBar;
+    height: 100%;
+    overflow-y: auto;
+    padding: $euiSize;
 
-.mapLayerPanel__header {
-  @include euiOverflowShadowBottom;
+    > *:last-child {
+      margin-bottom: $euiSize; /* 1 */
+    }
+  }
 }
 
 .mapLayerPanel__sourceDetails {
@@ -32,6 +37,5 @@
 }
 
 .mapLayerPanel__footer {
-  @include euiOverflowShadowTop;
   border-top: $euiBorderThin;
 }
diff --git a/x-pack/plugins/maps/public/components/layer_panel/view.js b/x-pack/plugins/maps/public/components/layer_panel/view.js
index 2fff3bf419873..b0e59a0757c21 100644
--- a/x-pack/plugins/maps/public/components/layer_panel/view.js
+++ b/x-pack/plugins/maps/public/components/layer_panel/view.js
@@ -20,7 +20,6 @@ import {
   EuiPanel,
   EuiFlexGroup,
   EuiFlyoutHeader,
-  EuiFlyoutBody,
   EuiFlyoutFooter,
   EuiSpacer,
   EuiAccordion,
@@ -192,21 +191,23 @@ export class LayerPanel extends React.Component {
           </div>
         </EuiFlyoutHeader>
 
-        <EuiFlyoutBody className="mapLayerPanel__body">
+        <div className="mapLayerPanel__body">
+          <div className="mapLayerPanel__bodyOverflow">
 
-          <LayerErrors/>
+            <LayerErrors/>
 
-          <LayerSettings/>
+            <LayerSettings/>
 
-          <SourceSettings/>
+            <SourceSettings/>
 
-          {this._renderFilterSection()}
+            {this._renderFilterSection()}
 
-          {this._renderJoinSection()}
+            {this._renderJoinSection()}
 
-          <StyleTabs layer={selectedLayer}/>
+            <StyleTabs layer={selectedLayer}/>
 
-        </EuiFlyoutBody>
+          </div>
+        </div>
 
         <EuiFlyoutFooter className="mapLayerPanel__footer">
           <FlyoutFooter hasStateChanged={this.props.hasStateChanged}/>
diff --git a/x-pack/plugins/ml/public/components/rule_editor/__snapshots__/rule_editor_flyout.test.js.snap b/x-pack/plugins/ml/public/components/rule_editor/__snapshots__/rule_editor_flyout.test.js.snap
index 420d459044a8a..917e71b84ae34 100644
--- a/x-pack/plugins/ml/public/components/rule_editor/__snapshots__/rule_editor_flyout.test.js.snap
+++ b/x-pack/plugins/ml/public/components/rule_editor/__snapshots__/rule_editor_flyout.test.js.snap
@@ -20,7 +20,7 @@ exports[`RuleEditorFlyout renders the flyout after adding a condition to a rule
       hasBorder={true}
     >
       <EuiTitle
-        size="l"
+        size="m"
       >
         <h1
           id="flyoutTitle"
@@ -280,7 +280,7 @@ exports[`RuleEditorFlyout renders the flyout after setting the rule to edit 1`]
       hasBorder={true}
     >
       <EuiTitle
-        size="l"
+        size="m"
       >
         <h1
           id="flyoutTitle"
@@ -554,7 +554,7 @@ exports[`RuleEditorFlyout renders the flyout for creating a rule with conditions
       hasBorder={true}
     >
       <EuiTitle
-        size="l"
+        size="m"
       >
         <h1
           id="flyoutTitle"
@@ -806,7 +806,7 @@ exports[`RuleEditorFlyout renders the select action component for a detector wit
       hasBorder={true}
     >
       <EuiTitle
-        size="l"
+        size="m"
       >
         <h1
           id="flyoutTitle"
diff --git a/x-pack/plugins/ml/public/components/rule_editor/rule_editor_flyout.js b/x-pack/plugins/ml/public/components/rule_editor/rule_editor_flyout.js
index 77402de18eec7..904185fccf3f3 100644
--- a/x-pack/plugins/ml/public/components/rule_editor/rule_editor_flyout.js
+++ b/x-pack/plugins/ml/public/components/rule_editor/rule_editor_flyout.js
@@ -475,7 +475,7 @@ export const RuleEditorFlyout = injectI18n(class RuleEditorFlyout extends Compon
           aria-labelledby="flyoutTitle"
         >
           <EuiFlyoutHeader hasBorder={true}>
-            <EuiTitle size="l">
+            <EuiTitle size="m">
               <h1 id="flyoutTitle">
                 <FormattedMessage
                   id="xpack.ml.ruleEditor.ruleEditorFlyout.editRulesTitle"
@@ -534,7 +534,7 @@ export const RuleEditorFlyout = injectI18n(class RuleEditorFlyout extends Compon
           aria-labelledby="flyoutTitle"
         >
           <EuiFlyoutHeader hasBorder={true}>
-            <EuiTitle size="l">
+            <EuiTitle size="m">
               <h1 id="flyoutTitle">
                 {(isCreate === true) ? (
                   <FormattedMessage
diff --git a/x-pack/plugins/ml/public/components/rule_editor/select_rule_action/__snapshots__/delete_rule_modal.test.js.snap b/x-pack/plugins/ml/public/components/rule_editor/select_rule_action/__snapshots__/delete_rule_modal.test.js.snap
index 37be903bc85b2..f2b501fb67a7a 100644
--- a/x-pack/plugins/ml/public/components/rule_editor/select_rule_action/__snapshots__/delete_rule_modal.test.js.snap
+++ b/x-pack/plugins/ml/public/components/rule_editor/select_rule_action/__snapshots__/delete_rule_modal.test.js.snap
@@ -47,7 +47,7 @@ exports[`DeleteRuleModal renders modal after clicking delete rule link 1`] = `
   </EuiLink>
   <EuiOverlayMask>
     <EuiConfirmModal
-      buttonColor="primary"
+      buttonColor="danger"
       cancelButtonText={
         <FormattedMessage
           defaultMessage="Cancel"
diff --git a/x-pack/plugins/ml/public/components/rule_editor/select_rule_action/delete_rule_modal.js b/x-pack/plugins/ml/public/components/rule_editor/select_rule_action/delete_rule_modal.js
index 50a2b38c41063..7878ee1717cfc 100644
--- a/x-pack/plugins/ml/public/components/rule_editor/select_rule_action/delete_rule_modal.js
+++ b/x-pack/plugins/ml/public/components/rule_editor/select_rule_action/delete_rule_modal.js
@@ -58,6 +58,7 @@ export class DeleteRuleModal extends Component {
             />}
             onCancel={this.closeModal}
             onConfirm={this.deleteRule}
+            buttonColor="danger"
             cancelButtonText={<FormattedMessage
               id="xpack.ml.ruleEditor.deleteRuleModal.cancelButtonLabel"
               defaultMessage="Cancel"
diff --git a/x-pack/plugins/ml/public/settings/calendars/edit/import_modal/__snapshots__/import_modal.test.js.snap b/x-pack/plugins/ml/public/settings/calendars/edit/import_modal/__snapshots__/import_modal.test.js.snap
index 55e0a65e610f5..179e453281cd6 100644
--- a/x-pack/plugins/ml/public/settings/calendars/edit/import_modal/__snapshots__/import_modal.test.js.snap
+++ b/x-pack/plugins/ml/public/settings/calendars/edit/import_modal/__snapshots__/import_modal.test.js.snap
@@ -52,6 +52,18 @@ exports[`ImportModal Renders import modal 1`] = `
       </EuiFlexGroup>
     </EuiModalBody>
     <EuiModalFooter>
+      <EuiButtonEmpty
+        color="primary"
+        iconSide="left"
+        onClick={[MockFunction]}
+        type="button"
+      >
+        <FormattedMessage
+          defaultMessage="Cancel"
+          id="xpack.ml.calendarsEdit.eventsTable.cancelButtonLabel"
+          values={Object {}}
+        />
+      </EuiButtonEmpty>
       <EuiButton
         color="primary"
         disabled={true}
@@ -67,18 +79,6 @@ exports[`ImportModal Renders import modal 1`] = `
           values={Object {}}
         />
       </EuiButton>
-      <EuiButtonEmpty
-        color="primary"
-        iconSide="left"
-        onClick={[MockFunction]}
-        type="button"
-      >
-        <FormattedMessage
-          defaultMessage="Cancel"
-          id="xpack.ml.calendarsEdit.eventsTable.cancelButtonLabel"
-          values={Object {}}
-        />
-      </EuiButtonEmpty>
     </EuiModalFooter>
   </EuiModal>
 </Fragment>
diff --git a/x-pack/plugins/ml/public/settings/calendars/edit/import_modal/import_modal.js b/x-pack/plugins/ml/public/settings/calendars/edit/import_modal/import_modal.js
index d1a1f2df87cdb..9f7b2b7250a45 100644
--- a/x-pack/plugins/ml/public/settings/calendars/edit/import_modal/import_modal.js
+++ b/x-pack/plugins/ml/public/settings/calendars/edit/import_modal/import_modal.js
@@ -198,6 +198,14 @@ export const ImportModal = injectI18n(class ImportModal extends Component {
           </EuiModalBody>
 
           <EuiModalFooter>
+            <EuiButtonEmpty
+              onClick={closeImportModal}
+            >
+              <FormattedMessage
+                id="xpack.ml.calendarsEdit.eventsTable.cancelButtonLabel"
+                defaultMessage="Cancel"
+              />
+            </EuiButtonEmpty>
             <EuiButton
               onClick={this.handleEventsAdd}
               fill
@@ -208,14 +216,6 @@ export const ImportModal = injectI18n(class ImportModal extends Component {
                 defaultMessage="Import"
               />
             </EuiButton>
-            <EuiButtonEmpty
-              onClick={closeImportModal}
-            >
-              <FormattedMessage
-                id="xpack.ml.calendarsEdit.eventsTable.cancelButtonLabel"
-                defaultMessage="Cancel"
-              />
-            </EuiButtonEmpty>
           </EuiModalFooter>
         </EuiModal>
       </Fragment>
diff --git a/x-pack/plugins/ml/public/settings/calendars/edit/new_event_modal/new_event_modal.js b/x-pack/plugins/ml/public/settings/calendars/edit/new_event_modal/new_event_modal.js
index 2c2f404e0c343..40bd91a3a2166 100644
--- a/x-pack/plugins/ml/public/settings/calendars/edit/new_event_modal/new_event_modal.js
+++ b/x-pack/plugins/ml/public/settings/calendars/edit/new_event_modal/new_event_modal.js
@@ -297,6 +297,14 @@ export const NewEventModal = injectI18n(class NewEventModal extends Component {
           </EuiModalBody>
 
           <EuiModalFooter>
+            <EuiButtonEmpty
+              onClick={closeModal}
+            >
+              <FormattedMessage
+                id="xpack.ml.calendarsEdit.newEventModal.cancelButtonLabel"
+                defaultMessage="Cancel"
+              />
+            </EuiButtonEmpty>
             <EuiButton
               onClick={this.handleAddEvent}
               fill
@@ -307,14 +315,6 @@ export const NewEventModal = injectI18n(class NewEventModal extends Component {
                 defaultMessage="Add"
               />
             </EuiButton>
-            <EuiButtonEmpty
-              onClick={closeModal}
-            >
-              <FormattedMessage
-                id="xpack.ml.calendarsEdit.newEventModal.cancelButtonLabel"
-                defaultMessage="Cancel"
-              />
-            </EuiButtonEmpty>
           </EuiModalFooter>
         </EuiModal>
       </Fragment>
diff --git a/x-pack/plugins/ml/public/timeseriesexplorer/components/forecasting_modal/modal.js b/x-pack/plugins/ml/public/timeseriesexplorer/components/forecasting_modal/modal.js
index 7b62a4e496236..a9a747818f3d1 100644
--- a/x-pack/plugins/ml/public/timeseriesexplorer/components/forecasting_modal/modal.js
+++ b/x-pack/plugins/ml/public/timeseriesexplorer/components/forecasting_modal/modal.js
@@ -37,7 +37,7 @@ export function Modal(props) {
     <EuiOverlayMask>
       <EuiModal
         onClose={props.close}
-        maxWidth="860px"
+        maxWidth={860}
       >
 
         <EuiModalHeader>
diff --git a/x-pack/plugins/reporting/public/components/__snapshots__/report_info_button.test.tsx.snap b/x-pack/plugins/reporting/public/components/__snapshots__/report_info_button.test.tsx.snap
index 85e9f7dad9298..51cc6747f7d21 100644
--- a/x-pack/plugins/reporting/public/components/__snapshots__/report_info_button.test.tsx.snap
+++ b/x-pack/plugins/reporting/public/components/__snapshots__/report_info_button.test.tsx.snap
@@ -178,7 +178,7 @@ Array [
                             class="euiFlyoutHeader euiFlyoutHeader--hasBorder"
                           >
                             <h2
-                              class="euiTitle euiTitle--small"
+                              class="euiTitle euiTitle--medium"
                               id="flyoutTitle"
                             >
                               Unable to fetch report info
@@ -242,7 +242,7 @@ Array [
                               class="euiFlyoutHeader euiFlyoutHeader--hasBorder"
                             >
                               <h2
-                                class="euiTitle euiTitle--small"
+                                class="euiTitle euiTitle--medium"
                                 id="flyoutTitle"
                               >
                                 Unable to fetch report info
@@ -334,10 +334,10 @@ Array [
                         className="euiFlyoutHeader euiFlyoutHeader--hasBorder"
                       >
                         <EuiTitle
-                          size="s"
+                          size="m"
                         >
                           <h2
-                            className="euiTitle euiTitle--small"
+                            className="euiTitle euiTitle--medium"
                             id="flyoutTitle"
                           >
                             Unable to fetch report info
@@ -451,10 +451,10 @@ Array [
         className="euiFlyoutHeader euiFlyoutHeader--hasBorder"
       >
         <EuiTitle
-          size="s"
+          size="m"
         >
           <h2
-            className="euiTitle euiTitle--small"
+            className="euiTitle euiTitle--medium"
             id="flyoutTitle"
           >
             Unable to fetch report info
@@ -617,7 +617,7 @@ Array [
                             class="euiFlyoutHeader euiFlyoutHeader--hasBorder"
                           >
                             <h2
-                              class="euiTitle euiTitle--small"
+                              class="euiTitle euiTitle--medium"
                               id="flyoutTitle"
                             >
                               Job Info
@@ -679,7 +679,7 @@ Array [
                               class="euiFlyoutHeader euiFlyoutHeader--hasBorder"
                             >
                               <h2
-                                class="euiTitle euiTitle--small"
+                                class="euiTitle euiTitle--medium"
                                 id="flyoutTitle"
                               >
                                 Job Info
@@ -769,10 +769,10 @@ Array [
                         className="euiFlyoutHeader euiFlyoutHeader--hasBorder"
                       >
                         <EuiTitle
-                          size="s"
+                          size="m"
                         >
                           <h2
-                            className="euiTitle euiTitle--small"
+                            className="euiTitle euiTitle--medium"
                             id="flyoutTitle"
                           >
                             Job Info
@@ -884,10 +884,10 @@ Array [
         className="euiFlyoutHeader euiFlyoutHeader--hasBorder"
       >
         <EuiTitle
-          size="s"
+          size="m"
         >
           <h2
-            className="euiTitle euiTitle--small"
+            className="euiTitle euiTitle--medium"
             id="flyoutTitle"
           >
             Job Info
diff --git a/x-pack/plugins/reporting/public/components/report_info_button.tsx b/x-pack/plugins/reporting/public/components/report_info_button.tsx
index 2e60a49148efb..7e8ebafe0b196 100644
--- a/x-pack/plugins/reporting/public/components/report_info_button.tsx
+++ b/x-pack/plugins/reporting/public/components/report_info_button.tsx
@@ -217,7 +217,7 @@ export class ReportInfoButton extends Component<Props, State> {
             data-test-subj="reportInfoFlyout"
           >
             <EuiFlyoutHeader hasBorder>
-              <EuiTitle size="s">
+              <EuiTitle size="m">
                 <h2 id="flyoutTitle">{this.state.calloutTitle}</h2>
               </EuiTitle>
             </EuiFlyoutHeader>