Features integrations + mobile, copy, design tweaks (#115495)

* Features integrations + mobile, copy, design tweaks * i18n * ts fix * center button in no data card * tracking ids Co-authored-by: Kibana Machine <[email protected]>
elastic · Oct 20, 2021 · e258e14 · e258e14
1 parent 26a8d86
commit e258e14
Show file tree

Hide file tree

Showing 15 changed files with 225 additions and 96 deletions.
diff --git a/src/core/public/rendering/_base.scss b/src/core/public/rendering/_base.scss
@@ -43,10 +43,12 @@
     top: $headerHeight;
   }
 
-  .kbnStickyMenu {
-    position: sticky;
-    max-height: calc(100vh - #{$headerHeight + $euiSize});
-    top: $headerHeight + $euiSize;
+  @include euiBreakpoint('xl', 'l') {
+    .kbnStickyMenu {
+      position: sticky;
+      max-height: calc(100vh - #{$headerHeight + $euiSize});
+      top: $headerHeight + $euiSize;
+    }
   }
 }
 

diff --git a/...ditor/public/components/empty_prompts/empty_index_list_prompt/empty_index_list_prompt.tsx b/...ditor/public/components/empty_prompts/empty_index_list_prompt/empty_index_list_prompt.tsx
@@ -91,7 +91,7 @@ export const EmptyIndexListPrompt = ({
               <EuiCard
                 className="inpEmptyState__card"
                 onClick={() => {
-                  navigateToApp('home', { path: '/app/integrations/browse' });
+                  navigateToApp('integrations', { path: '/browse' });
                   closeFlyout();
                 }}
                 icon={<EuiIcon size="xl" type="database" color="subdued" />}

diff --git a/...ic/page_template/no_data_page/no_data_card/__snapshots__/elastic_agent_card.test.tsx.snap b/...ic/page_template/no_data_page/no_data_card/__snapshots__/elastic_agent_card.test.tsx.snap
diff --git a/...t/public/page_template/no_data_page/no_data_card/__snapshots__/no_data_card.test.tsx.snap b/...t/public/page_template/no_data_page/no_data_card/__snapshots__/no_data_card.test.tsx.snap
diff --git a/...lugins/kibana_react/public/page_template/no_data_page/no_data_card/elastic_agent_card.tsx b/...lugins/kibana_react/public/page_template/no_data_page/no_data_card/elastic_agent_card.tsx
@@ -44,6 +44,7 @@ export const ElasticAgentCard: FunctionComponent<ElasticAgentCardProps> = ({
       <EuiCard
         paddingSize="l"
         image={image}
+        textAlign="left"
         title={
           <EuiTextColor color="default">
             {i18n.translate('kibana-react.noDataPage.elasticAgentCard.noPermission.title', {
@@ -92,7 +93,12 @@ export const ElasticAgentCard: FunctionComponent<ElasticAgentCardProps> = ({
           defaultMessage: `Use Elastic Agent for a simple, unified way to collect data from your machines.`,
         })}
         betaBadgeLabel={recommended ? NO_DATA_RECOMMENDED : undefined}
-        footer={footer}
+        footer={
+          <div className="eui-textCenter">
+            {button}
+            {footer}
+          </div>
+        }
         layout={layout as 'vertical' | undefined}
         {...cardRest}
       />

diff --git a/src/plugins/kibana_react/public/page_template/no_data_page/no_data_card/no_data_card.tsx b/src/plugins/kibana_react/public/page_template/no_data_page/no_data_card/no_data_card.tsx
@@ -27,14 +27,15 @@ export const NoDataCard: FunctionComponent<NoDataPageActions> = ({
   return (
     <EuiCard
       paddingSize="l"
+      textAlign="left"
       // TODO: we should require both title and description to be passed in by consumers since defaults are not adequate.
       // see comment: https://github.com/elastic/kibana/pull/111261/files#r708399140
       title={title!}
       description={i18n.translate('kibana-react.noDataPage.noDataCard.description', {
         defaultMessage: `Proceed without collecting data`,
       })}
       betaBadgeLabel={recommended ? NO_DATA_RECOMMENDED : undefined}
-      footer={footer}
+      footer={<div className="eui-textCenter">{footer}</div>}
       layout={layout as 'vertical' | undefined}
       {...cardRest}
     />

diff --git a/...fleet/public/applications/integrations/sections/epm/components/integration_preference.tsx b/...fleet/public/applications/integrations/sections/epm/components/integration_preference.tsx
@@ -46,7 +46,7 @@ const link = (
 const title = (
   <FormattedMessage
     id="xpack.fleet.epm.integrationPreference.title"
-    defaultMessage="When an integration is available for {link}, show:"
+    defaultMessage="If an integration is available for {link}, show:"
     values={{ link }}
   />
 );
@@ -115,6 +115,7 @@ export const IntegrationPreference = ({ initialType, onChange }: Props) => {
           name="preference"
         />
       </EuiForm>
+      <EuiSpacer size="m" />
     </EuiPanel>
   );
 };