[ML] Transforms: Fixes overflow of data grid into side navigation (#1…

…06091) * [ML] Transforms: Fixes overflow of data grid into side navigation * [ML] Remove unnecessary whitespace * [ML] Remove wrapping div on app
elastic · Jul 20, 2021 · 34c17af · 34c17af
1 parent 992f444
commit 34c17af
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 35 deletions.
diff --git a/x-pack/plugins/transform/public/app/app.tsx b/x-pack/plugins/transform/public/app/app.tsx
@@ -10,7 +10,7 @@ import { render, unmountComponentAtNode } from 'react-dom';
 import { Router, Route, Switch } from 'react-router-dom';
 import { ScopedHistory } from 'kibana/public';
 
-import { EuiErrorBoundary, EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
+import { EuiErrorBoundary } from '@elastic/eui';
 
 import { FormattedMessage } from '@kbn/i18n/react';
 
@@ -44,23 +44,19 @@ export const App: FC<{ history: ScopedHistory }> = ({ history }) => {
   }
 
   return (
-    <EuiFlexGroup justifyContent="spaceAround" data-test-subj="transformApp">
-      <EuiFlexItem grow={true}>
-        <Router history={history}>
-          <Switch>
-            <Route
-              path={`/${SECTION_SLUG.CLONE_TRANSFORM}/:transformId`}
-              component={CloneTransformSection}
-            />
-            <Route
-              path={`/${SECTION_SLUG.CREATE_TRANSFORM}/:savedObjectId`}
-              component={CreateTransformSection}
-            />
-            <Route path={`/`} component={TransformManagementSection} />
-          </Switch>
-        </Router>
-      </EuiFlexItem>
-    </EuiFlexGroup>
+    <Router history={history}>
+      <Switch>
+        <Route
+          path={`/${SECTION_SLUG.CLONE_TRANSFORM}/:transformId`}
+          component={CloneTransformSection}
+        />
+        <Route
+          path={`/${SECTION_SLUG.CREATE_TRANSFORM}/:savedObjectId`}
+          component={CreateTransformSection}
+        />
+        <Route path={`/`} component={TransformManagementSection} />
+      </Switch>
+    </Router>
   );
 };
 

diff --git a/x-pack/plugins/transform/public/app/sections/clone_transform/clone_transform_section.tsx b/x-pack/plugins/transform/public/app/sections/clone_transform/clone_transform_section.tsx
@@ -131,10 +131,7 @@ export const CloneTransformSection: FC<Props> = ({ match, location }) => {
 
       <EuiSpacer size="l" />
 
-      <EuiPageContentBody
-        data-test-subj="transformPageCloneTransform"
-        className="transform__wizardBody"
-      >
+      <EuiPageContentBody data-test-subj="transformPageCloneTransform">
         {typeof errorMessage !== 'undefined' && (
           <>
             <EuiCallOut

diff --git a/x-pack/plugins/transform/public/app/sections/create_transform/components/wizard/_wizard.scss b/x-pack/plugins/transform/public/app/sections/create_transform/components/wizard/_wizard.scss
@@ -7,12 +7,3 @@
     padding-right: 0;
   }
 }
-
-/*
-This ensures the wizard goes full page width, and that the data grid in the page does not
-cause the body of the wizard page to overflow into the side navigation of the Kibana
-Stack Management page on resize.
-*/
-.transform__wizardBody {
-  max-width: calc(100% - 16px);
-}
diff --git a/x-pack/plugins/transform/public/app/sections/create_transform/create_transform_section.tsx b/x-pack/plugins/transform/public/app/sections/create_transform/create_transform_section.tsx
@@ -68,10 +68,7 @@ export const CreateTransformSection: FC<Props> = ({ match }) => {
 
       <EuiSpacer size="l" />
 
-      <EuiPageContentBody
-        data-test-subj="transformPageCreateTransform"
-        className="transform__wizardBody"
-      >
+      <EuiPageContentBody data-test-subj="transformPageCreateTransform">
         {searchItemsError !== undefined && (
           <>
             <EuiCallOut title={searchItemsError} color="danger" iconType="alert" />