uptime - update uptime page styles (#98936)

elastic · Apr 30, 2021 · 82c3cba · 82c3cba
1 parent a80cdf7
commit 82c3cba
Showing 1 changed file with 17 additions and 5 deletions.
diff --git a/x-pack/plugins/uptime/public/apps/uptime_app.tsx b/x-pack/plugins/uptime/public/apps/uptime_app.tsx
@@ -4,12 +4,12 @@
  * 2.0; you may not use this file except in compliance with the Elastic License
  * 2.0.
  */
-
-import { EuiPage, EuiErrorBoundary } from '@elastic/eui';
-import { i18n } from '@kbn/i18n';
 import React, { useEffect } from 'react';
 import { Provider as ReduxProvider } from 'react-redux';
 import { Router } from 'react-router-dom';
+import styled from 'styled-components';
+import { EuiPage, EuiErrorBoundary } from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
 import { I18nStart, ChromeBreadcrumb, CoreStart, AppMountParameters } from 'kibana/public';
 import {
   KibanaContextProvider,
@@ -62,6 +62,18 @@ export interface UptimeAppProps {
   appMountParameters: AppMountParameters;
 }
 
+const StyledPage = styled(EuiPage)`
+  display: flex;
+  flex-grow: 1;
+  flex-shrink: 0;
+  flex-basis: auto;
+  flex-direction: column;
+
+  > * {
+    flex-shrink: 0;
+  }
+`;
+
 const Application = (props: UptimeAppProps) => {
   const {
     basePath,
@@ -118,15 +130,15 @@ const Application = (props: UptimeAppProps) => {
                   <UptimeSettingsContextProvider {...props}>
                     <UptimeThemeContextProvider darkMode={darkMode}>
                       <UptimeStartupPluginsContextProvider {...startPlugins}>
-                        <EuiPage data-test-subj="uptimeApp">
+                        <StyledPage data-test-subj="uptimeApp">
                           <RedirectAppLinks application={core.application}>
                             <main>
                               <UptimeAlertsFlyoutWrapper />
                               <PageRouter />
                               <ActionMenu appMountParameters={appMountParameters} />
                             </main>
                           </RedirectAppLinks>
-                        </EuiPage>
+                        </StyledPage>
                       </UptimeStartupPluginsContextProvider>
                     </UptimeThemeContextProvider>
                   </UptimeSettingsContextProvider>