From 074079650b493ad48a3c65f6abc11453a096cb1f Mon Sep 17 00:00:00 2001 From: Michael Marcialis Date: Fri, 21 Aug 2020 10:50:47 -0400 Subject: [PATCH 1/3] fix flex and hover/focus in solution cards --- .../components/_solutions_section.scss | 26 ++++++++++++------- .../solutions_section/solution_panel.tsx | 8 ++++-- 2 files changed, 23 insertions(+), 11 deletions(-) diff --git a/src/plugins/home/public/application/components/_solutions_section.scss b/src/plugins/home/public/application/components/_solutions_section.scss index dab7d45c8b4da..be693707e06b4 100644 --- a/src/plugins/home/public/application/components/_solutions_section.scss +++ b/src/plugins/home/public/application/components/_solutions_section.scss @@ -38,21 +38,29 @@ } .homSolutionPanel { - align-items: stretch; // Necessary because element is a button - display: flex !important; - flex-direction: column; - overflow: hidden; + border-radius: $euiBorderRadius; + color: inherit; + flex: 1; + transition: all $euiAnimSpeedFast $euiAnimSlightResistance; + + &:hover, + &:focus { + @include euiSlightShadowHover; + transform: translateY(-2px); - &:focus, - &:hover { .euiTitle { text-decoration: underline; } } - &:focus { - @include euiFocusRing('large'); - @include euiSlightShadowHover; + &, + .euiPanel { + display: flex; + flex-direction: column; + } + + .euiPanel { + overflow: hidden; } } diff --git a/src/plugins/home/public/application/components/solutions_section/solution_panel.tsx b/src/plugins/home/public/application/components/solutions_section/solution_panel.tsx index ec4921ac3c3f2..c2ae2f82eaa46 100644 --- a/src/plugins/home/public/application/components/solutions_section/solution_panel.tsx +++ b/src/plugins/home/public/application/components/solutions_section/solution_panel.tsx @@ -58,8 +58,12 @@ export const SolutionPanel: FC = ({ addBasePath, solution }) => ( } homSolutions__item`} grow={1} > - - + + Date: Fri, 21 Aug 2020 12:02:47 -0400 Subject: [PATCH 2/3] change iconography to better match updated text --- .../application/components/_add_data.scss | 22 +++++++++++++++++++ .../public/application/components/_index.scss | 1 + .../components/add_data/add_data.test.tsx | 4 ++-- .../public/application/components/home.js | 2 +- .../plugins/ingest_manager/public/plugin.ts | 2 +- x-pack/plugins/ml/public/register_feature.ts | 2 +- 6 files changed, 28 insertions(+), 5 deletions(-) create mode 100644 src/plugins/home/public/application/components/_add_data.scss diff --git a/src/plugins/home/public/application/components/_add_data.scss b/src/plugins/home/public/application/components/_add_data.scss new file mode 100644 index 0000000000000..e588edfe35240 --- /dev/null +++ b/src/plugins/home/public/application/components/_add_data.scss @@ -0,0 +1,22 @@ +/* + * Licensed to Elasticsearch B.V. under one or more contributor + * license agreements. See the NOTICE file distributed with + * this work for additional information regarding copyright + * ownership. Elasticsearch B.V. licenses this file to you under + * the Apache License, Version 2.0 (the "License"); you may + * not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, + * software distributed under the License is distributed on an + * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY + * KIND, either express or implied. See the License for the + * specific language governing permissions and limitations + * under the License. + */ + +.homDataAdd__content .euiIcon__fillSecondary { + fill: $euiColorDarkestShade; +} diff --git a/src/plugins/home/public/application/components/_index.scss b/src/plugins/home/public/application/components/_index.scss index 933e8aa597a85..a0547a4588561 100644 --- a/src/plugins/home/public/application/components/_index.scss +++ b/src/plugins/home/public/application/components/_index.scss @@ -6,6 +6,7 @@ // homChart__legend-isLoading @import 'home'; +@import 'add_data'; @import 'manage_data'; @import 'sample_data_set_cards'; @import 'solutions_section'; diff --git a/src/plugins/home/public/application/components/add_data/add_data.test.tsx b/src/plugins/home/public/application/components/add_data/add_data.test.tsx index 16c4c05133dbb..e76e834802284 100644 --- a/src/plugins/home/public/application/components/add_data/add_data.test.tsx +++ b/src/plugins/home/public/application/components/add_data/add_data.test.tsx @@ -67,7 +67,7 @@ const mockFeatures = [ category: 'admin', description: 'Add and manage your fleet of Elastic Agents and integrations.', homePageSection: 'add_data', - icon: 'logstashInput', + icon: 'indexManagementApp', id: 'ingestManager', order: 510, path: '/app/ingestManager', @@ -77,7 +77,7 @@ const mockFeatures = [ category: 'data', description: 'Import your own CSV, NDJSON, or log file', homePageSection: 'add_data', - icon: 'importAction', + icon: 'document', id: 'ml_file_data_visualizer', order: 520, path: '/app/ml#/filedatavisualizer', diff --git a/src/plugins/home/public/application/components/home.js b/src/plugins/home/public/application/components/home.js index 75feb7603f67c..6c44c15faf4bf 100644 --- a/src/plugins/home/public/application/components/home.js +++ b/src/plugins/home/public/application/components/home.js @@ -155,7 +155,7 @@ export class Home extends Component { - + {i18n.translate('home.pageHeader.addDataButtonLabel', { defaultMessage: 'Add data', })} diff --git a/x-pack/plugins/ingest_manager/public/plugin.ts b/x-pack/plugins/ingest_manager/public/plugin.ts index 68e15fba9d4f7..9f4aa2e18000d 100644 --- a/x-pack/plugins/ingest_manager/public/plugin.ts +++ b/x-pack/plugins/ingest_manager/public/plugin.ts @@ -108,7 +108,7 @@ export class IngestManagerPlugin description: i18n.translate('xpack.ingestManager.featureCatalogueDescription', { defaultMessage: 'Add and manage your fleet of Elastic Agents and integrations.', }), - icon: 'logstashInput', + icon: 'indexManagementApp', showOnHomePage: true, path: BASE_PATH, category: FeatureCatalogueCategory.DATA, diff --git a/x-pack/plugins/ml/public/register_feature.ts b/x-pack/plugins/ml/public/register_feature.ts index 591c9acd368c4..942e9b7f33a40 100644 --- a/x-pack/plugins/ml/public/register_feature.ts +++ b/x-pack/plugins/ml/public/register_feature.ts @@ -40,7 +40,7 @@ export const registerFeature = (home: HomePublicPluginSetup) => { description: i18n.translate('xpack.ml.fileDataVisualizerDescription', { defaultMessage: 'Import your own CSV, NDJSON, or log file.', }), - icon: 'importAction', + icon: 'document', path: '/app/ml#/filedatavisualizer', showOnHomePage: true, category: FeatureCatalogueCategory.DATA, From 086e2ab7b0088560be9a4e3fea0e2a96b314aa1f Mon Sep 17 00:00:00 2001 From: Michael Marcialis Date: Fri, 21 Aug 2020 12:04:54 -0400 Subject: [PATCH 3/3] update snapshots --- .../__snapshots__/home.test.js.snap | 30 +++++++++---------- .../__snapshots__/add_data.test.tsx.snap | 4 +-- .../solution_panel.test.tsx.snap | 2 +- 3 files changed, 18 insertions(+), 18 deletions(-) diff --git a/src/plugins/home/public/application/components/__snapshots__/home.test.js.snap b/src/plugins/home/public/application/components/__snapshots__/home.test.js.snap index 09e9386d4f49f..1b10756c2975c 100644 --- a/src/plugins/home/public/application/components/__snapshots__/home.test.js.snap +++ b/src/plugins/home/public/application/components/__snapshots__/home.test.js.snap @@ -39,7 +39,7 @@ exports[`home change home route should render a link to change the default route > Add data @@ -157,7 +157,7 @@ exports[`home directories should not render directory entry when showOnHomePage > Add data @@ -273,7 +273,7 @@ exports[`home directories should render ADMIN directory entry in "Manage your da > Add data @@ -391,7 +391,7 @@ exports[`home directories should render DATA directory entry in "Ingest your dat > Add data @@ -509,7 +509,7 @@ exports[`home directories should render solutions in the "solution section" 1`] > Add data @@ -665,7 +665,7 @@ exports[`home header render 1`] = ` > Add data @@ -771,7 +771,7 @@ exports[`home header should show "Dev tools" link if console is available 1`] = > Add data @@ -899,7 +899,7 @@ exports[`home header should show "Manage" link if stack management is available > Add data @@ -1015,7 +1015,7 @@ exports[`home isNewKibanaInstance should safely handle execeptions 1`] = ` > Add data @@ -1121,7 +1121,7 @@ exports[`home isNewKibanaInstance should set isNewKibanaInstance to false when t > Add data @@ -1227,7 +1227,7 @@ exports[`home isNewKibanaInstance should set isNewKibanaInstance to true when th > Add data @@ -1333,7 +1333,7 @@ exports[`home should render home component 1`] = ` > Add data @@ -1439,7 +1439,7 @@ exports[`home welcome should show the normal home page if loading fails 1`] = ` > Add data @@ -1545,7 +1545,7 @@ exports[`home welcome should show the normal home page if welcome screen is disa > Add data @@ -1658,7 +1658,7 @@ exports[`home welcome stores skip welcome setting if skipped 1`] = ` > Add data diff --git a/src/plugins/home/public/application/components/add_data/__snapshots__/add_data.test.tsx.snap b/src/plugins/home/public/application/components/add_data/__snapshots__/add_data.test.tsx.snap index f51e30926a3f9..787802e508ca7 100644 --- a/src/plugins/home/public/application/components/add_data/__snapshots__/add_data.test.tsx.snap +++ b/src/plugins/home/public/application/components/add_data/__snapshots__/add_data.test.tsx.snap @@ -68,7 +68,7 @@ exports[`AddData render 1`] = ` >