From dc4697d6e39d55fb8b67a966b3585d1a4d32aa0e Mon Sep 17 00:00:00 2001 From: Dominique Clarke Date: Mon, 22 Feb 2021 22:11:26 -0500 Subject: [PATCH] adjust waterfall chart sidebar CSS to appropriately display border (#92191) Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com> --- .../monitor/synthetics/waterfall/components/styles.ts | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/x-pack/plugins/uptime/public/components/monitor/synthetics/waterfall/components/styles.ts b/x-pack/plugins/uptime/public/components/monitor/synthetics/waterfall/components/styles.ts index c0a75e0e09b223..433f59d0e83afa 100644 --- a/x-pack/plugins/uptime/public/components/monitor/synthetics/waterfall/components/styles.ts +++ b/x-pack/plugins/uptime/public/components/monitor/synthetics/waterfall/components/styles.ts @@ -9,7 +9,7 @@ import { FunctionComponent } from 'react'; import { StyledComponent } from 'styled-components'; import { EuiPanel, EuiFlexGroup, EuiFlexItem, EuiText, EuiPanelProps } from '@elastic/eui'; import { rgba } from 'polished'; -import { FIXED_AXIS_HEIGHT, SIDEBAR_GROW_SIZE } from './constants'; +import { FIXED_AXIS_HEIGHT } from './constants'; import { euiStyled, EuiTheme } from '../../../../../../../../../src/plugins/kibana_react/common'; interface WaterfallChartOuterContainerProps { @@ -49,7 +49,7 @@ export const WaterfallChartFixedTopContainer = euiStyled(StyledScrollDiv)` `; export const WaterfallChartAxisOnlyContainer = euiStyled(EuiFlexItem)` - margin-left: -22px; + margin-left: -16px; `; export const WaterfallChartTopContainer = euiStyled(EuiFlexGroup)` @@ -83,9 +83,9 @@ interface WaterfallChartSidebarContainer { } export const WaterfallChartSidebarWrapper = euiStyled(EuiFlexItem)` - max-width: ${SIDEBAR_GROW_SIZE * 10}%; z-index: ${(props) => props.theme.eui.euiZLevel5}; -`; + min-width: 0; +`; // NOTE: min-width: 0 ensures flexbox and no-wrap children can co-exist export const WaterfallChartSidebarContainer = euiStyled.div` height: ${(props) => `${props.height}px`};