From 54cdf2378d3c70192453a092b45ff3de26720355 Mon Sep 17 00:00:00 2001 From: Viraj Sanghvi Date: Fri, 19 Jul 2024 09:16:32 -0700 Subject: [PATCH] refactor: density and consistency changes for discover and query bar (#7299) * refactor: density and consistency changes for discover and query ba --------- Signed-off-by: Viraj Sanghvi Co-authored-by: opensearch-changeset-bot[bot] <154024398+opensearch-changeset-bot[bot]@users.noreply.github.com> --- changelogs/fragments/7299.yml | 2 ++ .../public/ui/filter_bar/_global_filter_group.scss | 6 ++---- .../public/ui/filter_bar/_global_filter_item.scss | 2 +- .../data/public/ui/filter_bar/filter_bar.tsx | 4 ++-- .../public/ui/filter_bar/filter_editor/index.tsx | 2 +- .../public/ui/query_string_input/_query_bar.scss | 2 +- .../components/data_grid/data_grid_table_flyout.tsx | 4 +++- .../default_discover_table/_table_cell.scss | 13 +++++++++++-- .../default_discover_table/_table_header.scss | 5 +++++ .../components/default_discover_table/table_row.tsx | 2 +- .../__snapshots__/json_code_block.test.tsx.snap | 1 + .../components/json_code_block/json_code_block.tsx | 2 +- .../components/sidebar/discover_sidebar.scss | 2 ++ .../components/top_nav/get_top_nav_links.tsx | 2 +- .../inspector/public/ui/inspector_view_chooser.tsx | 13 ++++++++----- 15 files changed, 42 insertions(+), 20 deletions(-) create mode 100644 changelogs/fragments/7299.yml diff --git a/changelogs/fragments/7299.yml b/changelogs/fragments/7299.yml new file mode 100644 index 000000000000..bda41acd6d58 --- /dev/null +++ b/changelogs/fragments/7299.yml @@ -0,0 +1,2 @@ +refactor: +- Density and consistency changes for discover and query bar ([#7299](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/7299)) \ No newline at end of file diff --git a/src/plugins/data/public/ui/filter_bar/_global_filter_group.scss b/src/plugins/data/public/ui/filter_bar/_global_filter_group.scss index f1af6e7f9b7e..9b25e874b190 100644 --- a/src/plugins/data/public/ui/filter_bar/_global_filter_group.scss +++ b/src/plugins/data/public/ui/filter_bar/_global_filter_group.scss @@ -32,10 +32,8 @@ } .globalFilterGroup__branch { - padding: $euiSizeS $euiSizeM 0 0; - background-repeat: no-repeat; - background-position: $euiSizeM ($euiSizeS * -1); - background-image: url("data:image/svg+xml,%0A%3Csvg width='28px' height='28px' viewBox='0 0 28 28' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='#{hexToRGB($euiColorLightShade)}'%3E%3Crect x='14' y='27' width='14' height='1'%3E%3C/rect%3E%3C/g%3E%3C/svg%3E"); + // matches inline #GlobalFilterGroup height and same size as add filter button + padding to vertically center + line-height: 40px; } .globalFilterGroup__wrapper { diff --git a/src/plugins/data/public/ui/filter_bar/_global_filter_item.scss b/src/plugins/data/public/ui/filter_bar/_global_filter_item.scss index 25cdce24aa8e..0afa48e428e1 100644 --- a/src/plugins/data/public/ui/filter_bar/_global_filter_item.scss +++ b/src/plugins/data/public/ui/filter_bar/_global_filter_item.scss @@ -83,7 +83,7 @@ } .globalFilterItem__editorForm { - padding: $euiSizeM; + padding: $euiSizeS; } .globalFilterItem__popover, diff --git a/src/plugins/data/public/ui/filter_bar/filter_bar.tsx b/src/plugins/data/public/ui/filter_bar/filter_bar.tsx index a423b1714a4d..964b1fe82fb7 100644 --- a/src/plugins/data/public/ui/filter_bar/filter_bar.tsx +++ b/src/plugins/data/public/ui/filter_bar/filter_bar.tsx @@ -110,15 +110,15 @@ function FilterBarUI(props: Props) { const button = ( setIsAddFilterPopoverOpen(true)} data-test-subj="addFilter" aria-label={i18n.translate('data.filter.filterBar.addFilterButtonLabel', { defaultMessage: 'Add filter', })} className="globalFilterBar__addButton" + iconType="plusInCircle" > - +{' '} { public render() { return (
- + - + + +

diff --git a/src/plugins/discover/public/application/components/json_code_block/__snapshots__/json_code_block.test.tsx.snap b/src/plugins/discover/public/application/components/json_code_block/__snapshots__/json_code_block.test.tsx.snap index 3897e22c50f1..4247a7b03084 100644 --- a/src/plugins/discover/public/application/components/json_code_block/__snapshots__/json_code_block.test.tsx.snap +++ b/src/plugins/discover/public/application/components/json_code_block/__snapshots__/json_code_block.test.tsx.snap @@ -3,6 +3,7 @@ exports[`returns the \`JsonCodeEditor\` component 1`] = ` + {stringify(hit, null, 2)} ); diff --git a/src/plugins/discover/public/application/components/sidebar/discover_sidebar.scss b/src/plugins/discover/public/application/components/sidebar/discover_sidebar.scss index b0bffeb2b216..58f168ea88d3 100644 --- a/src/plugins/discover/public/application/components/sidebar/discover_sidebar.scss +++ b/src/plugins/discover/public/application/components/sidebar/discover_sidebar.scss @@ -2,6 +2,8 @@ width: 100%; .euiButtonEmpty__content { + font-size: $euiFontSizeXS; + font-weight: $euiFontWeightSemiBold; justify-content: flex-end; } } diff --git a/src/plugins/discover/public/application/components/top_nav/get_top_nav_links.tsx b/src/plugins/discover/public/application/components/top_nav/get_top_nav_links.tsx index 6a5f815f9b3d..592cc23afffc 100644 --- a/src/plugins/discover/public/application/components/top_nav/get_top_nav_links.tsx +++ b/src/plugins/discover/public/application/components/top_nav/get_top_nav_links.tsx @@ -241,7 +241,7 @@ export const getTopNavLinks = ( }), run() { inspector.open(inspectorAdapters, { - title: savedSearch?.title, + title: savedSearch?.title || undefined, }); }, }; diff --git a/src/plugins/inspector/public/ui/inspector_view_chooser.tsx b/src/plugins/inspector/public/ui/inspector_view_chooser.tsx index 2f6bf71a5ada..5018969de94e 100644 --- a/src/plugins/inspector/public/ui/inspector_view_chooser.tsx +++ b/src/plugins/inspector/public/ui/inspector_view_chooser.tsx @@ -36,6 +36,7 @@ import { EuiContextMenuItem, EuiContextMenuPanel, EuiPopover, + EuiText, EuiToolTip, } from '@elastic/eui'; import { InspectorViewDescription } from '../types'; @@ -111,11 +112,13 @@ export class InspectorViewChooser extends Component { renderSingleView() { return ( - + + + ); }