Fixed a bit policy details header layout for small screens.

elastic · Jul 16, 2020 · 278b982 · 278b982
1 parent 7e533f2
commit 278b982
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 4 deletions.
diff --git a/x-pack/plugins/security_solution/public/management/pages/policy/view/agents_summary.tsx b/x-pack/plugins/security_solution/public/management/pages/policy/view/agents_summary.tsx
@@ -73,7 +73,7 @@ export const AgentsSummary = memo<AgentsSummaryProps>((props) => {
   }, []);
 
   return (
-    <EuiFlexGroup gutterSize="xl" data-test-subj="policyAgentsSummary">
+    <EuiFlexGroup gutterSize="xl" responsive={false} data-test-subj="policyAgentsSummary">
       {stats.map(({ key, title, health }) => {
         return (
           <EuiFlexItem grow={false} key={key}>

diff --git a/x-pack/plugins/security_solution/public/management/pages/policy/view/policy_details.tsx b/x-pack/plugins/security_solution/public/management/pages/policy/view/policy_details.tsx
@@ -16,6 +16,7 @@ import {
   EuiConfirmModal,
   EuiCallOut,
   EuiLoadingSpinner,
+  EuiHideFor,
 } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n/react';
 import { i18n } from '@kbn/i18n';
@@ -182,9 +183,11 @@ export const PolicyDetails = React.memo(() => {
           error={policyAgentStatusSummary?.error ?? 0}
         />
       </EuiFlexItem>
-      <EuiFlexItem>
-        <VerticalDivider spacing="l" />
-      </EuiFlexItem>
+      <EuiHideFor sizes={['xs', 's']}>
+        <EuiFlexItem>
+          <VerticalDivider spacing="l" />
+        </EuiFlexItem>
+      </EuiHideFor>
       <EuiFlexItem grow={false}>
         <EuiButtonEmpty onClick={handleCancelOnClick} data-test-subj="policyDetailsCancelButton">
           <FormattedMessage