diff --git a/packages/kbn-resizable-layout/src/panels_resizable.tsx b/packages/kbn-resizable-layout/src/panels_resizable.tsx index 968e5203047fe..300c9130b8100 100644 --- a/packages/kbn-resizable-layout/src/panels_resizable.tsx +++ b/packages/kbn-resizable-layout/src/panels_resizable.tsx @@ -64,6 +64,17 @@ export const PanelsResizable = ({ () => setResizeWithPortalsHackIsResizing(false), [] ); + const baseButtonCss = css` + background-color: transparent !important; + gap: 0 !important; + + &:not(:hover):not(:focus) { + &:before, + &:after { + width: 0; + } + } + `; const defaultButtonCss = css` z-index: 3; `; @@ -207,9 +218,10 @@ export const PanelsResizable = ({ - -
- - - - - -
- +
+ + + + + +
); } diff --git a/src/plugins/discover/public/application/main/components/layout/discover_layout.scss b/src/plugins/discover/public/application/main/components/layout/discover_layout.scss index 88da97d6f5333..55972b4f7f629 100644 --- a/src/plugins/discover/public/application/main/components/layout/discover_layout.scss +++ b/src/plugins/discover/public/application/main/components/layout/discover_layout.scss @@ -32,16 +32,6 @@ discover-app { height: 100%; } -.dscSidebarResizeButton { - background-color: transparent !important; - - &:not(:hover):not(:focus) { - &:before, &:after { - width: 0; - } - } -} - .dscPageContent__wrapper { overflow: hidden; // Ensures horizontal scroll of table display: flex; diff --git a/src/plugins/discover/public/application/main/components/layout/discover_main_content.tsx b/src/plugins/discover/public/application/main/components/layout/discover_main_content.tsx index f02de7e35c78f..8b6ff5880d3dc 100644 --- a/src/plugins/discover/public/application/main/components/layout/discover_main_content.tsx +++ b/src/plugins/discover/public/application/main/components/layout/discover_main_content.tsx @@ -6,7 +6,7 @@ * Side Public License, v 1. */ -import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui'; +import { EuiFlexGroup, EuiFlexItem, EuiHorizontalRule } from '@elastic/eui'; import { DragDrop, type DropType, DropOverlayWrapper } from '@kbn/dom-drag-drop'; import React, { useCallback, useMemo } from 'react'; import { DataView } from '@kbn/data-views-plugin/common'; @@ -20,6 +20,7 @@ import { DiscoverStateContainer } from '../../services/discover_state'; import { FieldStatisticsTab } from '../field_stats_table'; import { DiscoverDocuments } from './discover_documents'; import { DOCUMENTS_VIEW_CLICK, FIELD_STATISTICS_VIEW_CLICK } from '../field_stats_table/constants'; +import { useAppStateSelector } from '../../services/discover_app_state_container'; const DROP_PROPS = { value: { @@ -80,6 +81,8 @@ export const DiscoverMainContent = ({ ) : undefined; }, [viewMode, setDiscoverViewMode, isPlainRecord]); + const showChart = useAppStateSelector((state) => !state.hideChart); + return ( + {showChart && } {viewMode === VIEW_MODE.DOCUMENT_LEVEL ? ( } flexPanel={} - resizeButtonClassName="dscSidebarResizeButton" data-test-subj="discoverLayout" onFixedPanelSizeChange={setSidebarWidth} /> diff --git a/src/plugins/discover/public/components/discover_grid/render_custom_toolbar.scss b/src/plugins/discover/public/components/discover_grid/render_custom_toolbar.scss index 8926b223eda63..d54e7a6ba4fac 100644 --- a/src/plugins/discover/public/components/discover_grid/render_custom_toolbar.scss +++ b/src/plugins/discover/public/components/discover_grid/render_custom_toolbar.scss @@ -1,6 +1,5 @@ .dscGridToolbar { padding: $euiSizeS; - border-bottom: $euiBorderThin; } .dscGridToolbarControlButton .euiDataGrid__controlBtn { @@ -33,7 +32,7 @@ } .dscGridToolbarControlGroup { - border: $euiBorderThin; + box-shadow: inset 0 0 0 $euiBorderWidthThin $euiBorderColor; border-radius: $euiBorderRadiusSmall; display: inline-flex; align-items: stretch; @@ -57,10 +56,6 @@ } } -.dscGridToolbar .euiTabs { - transform: translateY(9px); -} - .dscGridToolbarBottom { position: relative; // for placing a loading indicator correctly } diff --git a/src/plugins/discover/public/components/doc_table/_doc_table.scss b/src/plugins/discover/public/components/doc_table/_doc_table.scss index 4553cdc05fdad..8a9b629a9694b 100644 --- a/src/plugins/discover/public/components/doc_table/_doc_table.scss +++ b/src/plugins/discover/public/components/doc_table/_doc_table.scss @@ -4,6 +4,7 @@ // stylelint-disable selector-no-qualifying-type .kbnDocTableWrapper { @include euiScrollBar; + @include euiOverflowShadow; overflow: auto; display: flex; flex: 1 1 100%; diff --git a/src/plugins/discover/public/components/view_mode_toggle/view_mode_toggle.tsx b/src/plugins/discover/public/components/view_mode_toggle/view_mode_toggle.tsx index ea6fce02db5bc..79c9213e76395 100644 --- a/src/plugins/discover/public/components/view_mode_toggle/view_mode_toggle.tsx +++ b/src/plugins/discover/public/components/view_mode_toggle/view_mode_toggle.tsx @@ -26,9 +26,13 @@ export const DocumentViewModeToggle = ({ const isLegacy = useMemo(() => uiSettings.get(DOC_TABLE_LEGACY), [uiSettings]); const includesNormalTabsStyle = viewMode === VIEW_MODE.AGGREGATED_LEVEL || isLegacy; + const tabsPadding = includesNormalTabsStyle ? euiTheme.size.s : 0; const tabsCss = css` - padding: 0 ${includesNormalTabsStyle ? euiTheme.size.s : 0}; - margin-top: ${includesNormalTabsStyle ? '17px' : 0}; + padding: ${tabsPadding} ${tabsPadding} 0 ${tabsPadding}; + + .euiTab__content { + line-height: ${euiTheme.size.xl}; + } `; const showViewModeToggle = uiSettings.get(SHOW_FIELD_STATISTICS) ?? false; @@ -38,16 +42,10 @@ export const DocumentViewModeToggle = ({ } return ( - + setDiscoverViewMode(VIEW_MODE.DOCUMENT_LEVEL)} - className="dscViewModeToggle__tab" data-test-subj="dscViewModeDocumentButton" > @@ -55,7 +53,6 @@ export const DocumentViewModeToggle = ({ setDiscoverViewMode(VIEW_MODE.AGGREGATED_LEVEL)} - className="dscViewModeToggle__tab" data-test-subj="dscViewModeFieldStatsButton" > data-test-subj={dataTestSubj} > {isLoading && } - - - {Boolean(prepend) && {prepend}} - {!!totalHitCount && ( - - - - )} - - + {(prepend || totalHitCount) && ( + + + {Boolean(prepend) && {prepend}} + + {!!totalHitCount && ( + + + + )} + + + )} {children}