From 27eb818a18a72b45d7f7d9b0c86567d8bb22967c Mon Sep 17 00:00:00 2001 From: James Gowdy Date: Wed, 6 Feb 2019 14:35:21 +0000 Subject: [PATCH 1/3] [ML] Style tweaks for job management in K7 --- .../jobs_list/components/jobs_list_view/_jobs_list_view.scss | 4 ---- .../components/multi_job_actions/_multi_job_actions.scss | 2 +- 2 files changed, 1 insertion(+), 5 deletions(-) diff --git a/x-pack/plugins/ml/public/jobs/jobs_list/components/jobs_list_view/_jobs_list_view.scss b/x-pack/plugins/ml/public/jobs/jobs_list/components/jobs_list_view/_jobs_list_view.scss index 64ba582f30c03..a7d562a9494cd 100644 --- a/x-pack/plugins/ml/public/jobs/jobs_list/components/jobs_list_view/_jobs_list_view.scss +++ b/x-pack/plugins/ml/public/jobs/jobs_list/components/jobs_list_view/_jobs_list_view.scss @@ -3,10 +3,6 @@ min-height: 60px; display: flex; align-items: center; - - & > div:nth-child(1) { - width: 300px; - } } .job-management { diff --git a/x-pack/plugins/ml/public/jobs/jobs_list/components/multi_job_actions/_multi_job_actions.scss b/x-pack/plugins/ml/public/jobs/jobs_list/components/multi_job_actions/_multi_job_actions.scss index e8bd1a45d9766..c8d2573024500 100644 --- a/x-pack/plugins/ml/public/jobs/jobs_list/components/multi_job_actions/_multi_job_actions.scss +++ b/x-pack/plugins/ml/public/jobs/jobs_list/components/multi_job_actions/_multi_job_actions.scss @@ -1,6 +1,6 @@ // SASSTODO: This looks like it needs some rewriting for all the pixel values .multi-select-actions { - padding: 10px 0px; + margin-right: $euiSizeS; display: inline-block; white-space: nowrap; From 255b8871f1274091f19d230c55fdfe3acb82e609 Mon Sep 17 00:00:00 2001 From: James Gowdy Date: Wed, 6 Feb 2019 15:32:06 +0000 Subject: [PATCH 2/3] adjusting search bar error --- .../job_filter_bar/job_filter_bar.js | 49 +++++++++---------- .../multi_job_actions/_multi_job_actions.scss | 3 +- 2 files changed, 26 insertions(+), 26 deletions(-) diff --git a/x-pack/plugins/ml/public/jobs/jobs_list/components/job_filter_bar/job_filter_bar.js b/x-pack/plugins/ml/public/jobs/jobs_list/components/job_filter_bar/job_filter_bar.js index d53bd5d895613..7ab58fe30a1e3 100644 --- a/x-pack/plugins/ml/public/jobs/jobs_list/components/job_filter_bar/job_filter_bar.js +++ b/x-pack/plugins/ml/public/jobs/jobs_list/components/job_filter_bar/job_filter_bar.js @@ -7,7 +7,8 @@ import PropTypes from 'prop-types'; import React, { - Component + Component, + Fragment, } from 'react'; import { ml } from 'plugins/ml/services/ml_api_service'; @@ -15,12 +16,12 @@ import { JobGroup } from '../job_group'; import { EuiSearchBar, - EuiCallOut, - EuiSpacer, EuiFlexGroup, EuiFlexItem, + EuiFormRow, } from '@elastic/eui'; import { FormattedMessage, injectI18n } from '@kbn/i18n/react'; +import { i18n } from '@kbn/i18n'; function loadGroups() { return ml.jobs.groups() @@ -68,29 +69,9 @@ class JobFilterBarUI extends Component { } }; - renderError() { - const { error } = this.state; - if (!error) { - return; - } - return ( - - - )} - /> - - - ); - } - render() { const { intl } = this.props; + const { error } = this.state; const filters = [ { type: 'field_value_toggle_group', @@ -164,8 +145,15 @@ class JobFilterBarUI extends Component { onChange={this.onChange} className="mlJobFilterBar" /> + + + - { this.renderError() || ''} ); } @@ -174,4 +162,15 @@ JobFilterBarUI.propTypes = { setFilters: PropTypes.func.isRequired, }; +function getError(error) { + if (error) { + return i18n.translate('xpack.ml.jobsList.jobFilterBar.invalidSearchErrorMessage', { + defaultMessage: 'Invalid search: {errorMessage}', + values: { errorMessage: error.message }, + }); + } + + return ''; +} + export const JobFilterBar = injectI18n(JobFilterBarUI); diff --git a/x-pack/plugins/ml/public/jobs/jobs_list/components/multi_job_actions/_multi_job_actions.scss b/x-pack/plugins/ml/public/jobs/jobs_list/components/multi_job_actions/_multi_job_actions.scss index c8d2573024500..999462df15539 100644 --- a/x-pack/plugins/ml/public/jobs/jobs_list/components/multi_job_actions/_multi_job_actions.scss +++ b/x-pack/plugins/ml/public/jobs/jobs_list/components/multi_job_actions/_multi_job_actions.scss @@ -1,6 +1,7 @@ // SASSTODO: This looks like it needs some rewriting for all the pixel values .multi-select-actions { - margin-right: $euiSizeS; + padding-right: $euiSizeS; + padding-bottom: $euiSizeM; display: inline-block; white-space: nowrap; From e907be7358288e2e6079ec7d8d1d63125f703d61 Mon Sep 17 00:00:00 2001 From: James Gowdy Date: Thu, 7 Feb 2019 09:05:02 +0000 Subject: [PATCH 3/3] removing custom title style for EuiTitle --- .../multi_job_actions/_multi_job_actions.scss | 14 ----------- .../multi_job_actions/multi_job_actions.js | 23 +++++++++++++------ 2 files changed, 16 insertions(+), 21 deletions(-) diff --git a/x-pack/plugins/ml/public/jobs/jobs_list/components/multi_job_actions/_multi_job_actions.scss b/x-pack/plugins/ml/public/jobs/jobs_list/components/multi_job_actions/_multi_job_actions.scss index 999462df15539..4298ce2691b68 100644 --- a/x-pack/plugins/ml/public/jobs/jobs_list/components/multi_job_actions/_multi_job_actions.scss +++ b/x-pack/plugins/ml/public/jobs/jobs_list/components/multi_job_actions/_multi_job_actions.scss @@ -5,20 +5,6 @@ display: inline-block; white-space: nowrap; - // SASSTODO: This looks like it should just be an EUI title - .jobs-selected-title { - display: inline-block; - font-weight: normal; - - color: #1a1a1a; - font-size: 28px; - font-size: 1.55rem; - line-height: 1.25; - font-weight: 300; - line-height: 2.5rem; - vertical-align: bottom; - } - .actions-border, .actions-border-large { height: 20px; border-right: $euiBorderThin; diff --git a/x-pack/plugins/ml/public/jobs/jobs_list/components/multi_job_actions/multi_job_actions.js b/x-pack/plugins/ml/public/jobs/jobs_list/components/multi_job_actions/multi_job_actions.js index 26017bad23ea6..75818761116fe 100644 --- a/x-pack/plugins/ml/public/jobs/jobs_list/components/multi_job_actions/multi_job_actions.js +++ b/x-pack/plugins/ml/public/jobs/jobs_list/components/multi_job_actions/multi_job_actions.js @@ -10,6 +10,10 @@ import React, { Component, Fragment } from 'react'; +import { + EuiTitle +} from '@elastic/eui'; + import { ResultLinks } from '../job_actions'; import { MultiJobActionsMenu } from './actions_menu'; import { GroupSelector } from './group_selector'; @@ -28,13 +32,18 @@ export class MultiJobActions extends Component {
{jobsSelected && - - - + +

+ +

+