diff --git a/x-pack/plugins/ml/public/application/timeseriesexplorer/_timeseriesexplorer.scss b/x-pack/plugins/ml/public/application/timeseriesexplorer/_timeseriesexplorer.scss index 8d4f6ad0a6844..45678f6e71c2e 100644 --- a/x-pack/plugins/ml/public/application/timeseriesexplorer/_timeseriesexplorer.scss +++ b/x-pack/plugins/ml/public/application/timeseriesexplorer/_timeseriesexplorer.scss @@ -24,10 +24,6 @@ } } - .single-metric-request-callout { - margin: 0 $euiSize; - } - .results-container { .panel-title { font-size: $euiFontSizeM; diff --git a/x-pack/plugins/ml/public/application/timeseriesexplorer/components/entity_control/entity_control.tsx b/x-pack/plugins/ml/public/application/timeseriesexplorer/components/entity_control/entity_control.tsx index 9d2c49a95fec4..e1323019d61db 100644 --- a/x-pack/plugins/ml/public/application/timeseriesexplorer/components/entity_control/entity_control.tsx +++ b/x-pack/plugins/ml/public/application/timeseriesexplorer/components/entity_control/entity_control.tsx @@ -9,13 +9,7 @@ import React, { Component } from 'react'; import { FormattedMessage } from '@kbn/i18n/react'; import { i18n } from '@kbn/i18n'; -import { - EuiComboBox, - EuiComboBoxOptionOption, - EuiFlexItem, - EuiFormRow, - EuiToolTip, -} from '@elastic/eui'; +import { EuiComboBox, EuiComboBoxOptionOption, EuiFlexItem, EuiFormRow } from '@elastic/eui'; export interface Entity { fieldName: string; @@ -156,9 +150,7 @@ export class EntityControl extends Component<EntityControlProps, EntityControlSt return ( <EuiFlexItem grow={false}> <EuiFormRow label={entity.fieldName} helpText={forceSelection ? selectMessage : null}> - <EuiToolTip position="right" content={forceSelection ? selectMessage : null}> - {control} - </EuiToolTip> + {control} </EuiFormRow> </EuiFlexItem> ); diff --git a/x-pack/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer.js b/x-pack/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer.js index 7d173e161a1cb..9b8764d3f9279 100644 --- a/x-pack/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer.js +++ b/x-pack/plugins/ml/public/application/timeseriesexplorer/timeseriesexplorer.js @@ -1133,23 +1133,25 @@ export class TimeSeriesExplorer extends React.Component { return ( <TimeSeriesExplorerPage dateFormatTz={dateFormatTz} resizeRef={this.resizeRef}> {fieldNamesWithEmptyValues.length > 0 && ( - <EuiCallOut - className="single-metric-request-callout" - title={ - <FormattedMessage - id="xpack.ml.timeSeriesExplorer.singleMetricRequiredMessage" - defaultMessage="To view a single metric you must select {missingValuesCount, plural, one {a value for {fieldName1}} other {values for {fieldName1} and {fieldName2}}}" - values={{ - missingValuesCount: fieldNamesWithEmptyValues.length, - fieldName1: fieldNamesWithEmptyValues[0], - fieldName2: fieldNamesWithEmptyValues[1], - }} - /> - } - color="warning" - iconType="help" - size="s" - /> + <> + <EuiCallOut + title={ + <FormattedMessage + id="xpack.ml.timeSeriesExplorer.singleMetricRequiredMessage" + defaultMessage="To view a single metric you must select {missingValuesCount, plural, one {a value for {fieldName1}} other {values for {fieldName1} and {fieldName2}}}" + values={{ + missingValuesCount: fieldNamesWithEmptyValues.length, + fieldName1: fieldNamesWithEmptyValues[0], + fieldName2: fieldNamesWithEmptyValues[1], + }} + /> + } + color="warning" + iconType="help" + size="s" + /> + <EuiSpacer size="m" /> + </> )} <div className="series-controls" data-test-subj="mlSingleMetricViewerSeriesControls">