diff --git a/x-pack/plugins/infra/public/apps/start_app.tsx b/x-pack/plugins/infra/public/apps/start_app.tsx index 66e699abd22b4..a797e4c9d4ba7 100644 --- a/x-pack/plugins/infra/public/apps/start_app.tsx +++ b/x-pack/plugins/infra/public/apps/start_app.tsx @@ -26,6 +26,7 @@ import { KibanaContextProvider, } from '../../../../../src/plugins/kibana_react/public'; import { AppRouter } from '../routers'; +import '../index.scss'; export const CONTAINER_CLASSNAME = 'infra-container-element'; @@ -74,12 +75,8 @@ export async function startApp( ); - // Ensure the element we're handed from application mounting takes up - // the full size it can, so that our inner application styles work as - // expected. - element.style.height = '100%'; - element.style.display = 'flex'; - element.style.overflowY = 'hidden'; // Prevent having scroll within a container having scroll. It messes up with drag-n-drop elements + // Ensure the element we're handed from application mounting is assigned a class + // for our index.scss styles to apply to. element.className += ` ${CONTAINER_CLASSNAME}`; ReactDOM.render(, element); diff --git a/x-pack/plugins/infra/public/index.scss b/x-pack/plugins/infra/public/index.scss index afee4ab8b0389..05e045c1bd53b 100644 --- a/x-pack/plugins/infra/public/index.scss +++ b/x-pack/plugins/infra/public/index.scss @@ -3,22 +3,13 @@ /* Infra plugin styles */ -// Prefix all styles with "inf" to avoid conflicts. -// Examples -// infChart -// infChart__legend -// infChart__legend--small -// infChart__legend-isLoading - -.infReactRoot { +.infra-container-element { background-color: $euiColorEmptyShade; position: absolute; top: 0; left: 0; bottom: 0; right: 0; - // display: flex; - // flex-direction: column; align-items: flex-start; flex: 1 0 auto; overflow-x: hidden; @@ -27,21 +18,3 @@ flex-direction: column; } -// This is a temporary workaround for https://github.com/elastic/kibana/issues/39808 -// A real fix will most likely depend on changes in elastic-charts. - -.infrastructureChart .echTooltip { - max-width: 90vw; -} - -.infrastructureChart .echTooltip__label { - overflow-x: hidden; - white-space: nowrap; - text-overflow: ellipsis; -} - -.metricsExplorerTitleAnchor { - white-space: nowrap; - text-overflow: ellipsis; - display: inline; -}