Rename a style.

elastic · May 26, 2021 · 4a79d37 · 4a79d37
1 parent f296935
commit 4a79d37
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 5 deletions.
diff --git a/...ptime/public/components/monitor/synthetics/waterfall/components/middle_truncated_text.tsx b/...ptime/public/components/monitor/synthetics/waterfall/components/middle_truncated_text.tsx
@@ -9,7 +9,7 @@ import React, { useMemo } from 'react';
 import styled from 'styled-components';
 import { FormattedMessage } from '@kbn/i18n/react';
 import { EuiScreenReaderOnly, EuiToolTip, EuiButtonEmpty, EuiLink } from '@elastic/eui';
-import { StyledWithEuiBreakpoints } from './styles';
+import { WaterfallResponsiveMaxWidth } from './styles';
 import { FIXED_AXIS_HEIGHT } from './constants';
 
 interface Props {
@@ -81,7 +81,7 @@ export const MiddleTruncatedText = ({ ariaLabel, text, onClick, setButtonRef, ur
       <EuiScreenReaderOnly>
         <span data-test-subj="middleTruncatedTextSROnly">{text}</span>
       </EuiScreenReaderOnly>
-      <StyledWithEuiBreakpoints
+      <WaterfallResponsiveMaxWidth
         as={EuiToolTip}
         content={text}
         data-test-subj="middleTruncatedTextToolTip"
@@ -107,7 +107,7 @@ export const MiddleTruncatedText = ({ ariaLabel, text, onClick, setButtonRef, ur
             </InnerContainer>
           )}
         </>
-      </StyledWithEuiBreakpoints>
+      </WaterfallResponsiveMaxWidth>
       <span>
         <EuiLink href={url} external target="_blank">
           <EuiScreenReaderOnly>

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
@@ -143,11 +143,11 @@ export const WaterfallChartLegendContainer = euiStyled.div`
   box-shadow: 0px -1px 4px 0px ${(props) => props.theme.eui.euiColorLightShade};
 `; // NOTE: EuiShadowColor is a little too dark to work with the background-color
 
-export const StyledWithEuiBreakpoints = euiStyled.div`
+export const WaterfallResponsiveMaxWidth = euiStyled.div`
   max-width: 90vw;
 `;
 
-export const WaterfallChartTooltip = euiStyled(StyledWithEuiBreakpoints)`
+export const WaterfallChartTooltip = euiStyled(WaterfallResponsiveMaxWidth)`
   background-color: ${(props) => props.theme.eui.euiColorDarkestShade};
   border-radius: ${(props) => props.theme.eui.euiBorderRadius};
   color: ${(props) => props.theme.eui.euiColorLightestShade};