github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 09:48:58 -04:00
Code Issues Projects Releases Packages Wiki Activity

[Dashboard] Fix z index of toolbar items (#154501)

Browse source 
Adds EUI theme props for zindex and reposition on scroll to the `select
type` and `controls` dashboard toolbar items so that they reposition
properly and don't overlap the header.
This commit is contained in:
Devon Thomson 2023-04-11 11:23:06 -04:00 • committed by GitHub
parent cdb908fc54
commit 7b26e7ce7d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 11 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/plugins/dashboard/public/dashboard_app/top_nav/controls_toolbar_button/controls_toolbar_button.tsx
View file

@ -8,7 +8,7 @@
import React from 'react';
import { EuiContextMenuPanel } from '@elastic/eui';
import { EuiContextMenuPanel, useEuiTheme } from '@elastic/eui';
import { ToolbarPopover } from '@kbn/shared-ux-button-toolbar';
import type { ControlGroupContainer } from '@kbn/controls-plugin/public';
@ -18,11 +18,15 @@ import { AddTimeSliderControlButton } from './add_time_slider_control_button';
import { EditControlGroupButton } from './edit_control_group_button';
export function ControlsToolbarButton({ controlGroup }: { controlGroup: ControlGroupContainer }) {
const { euiTheme } = useEuiTheme();
return (
<ToolbarPopover
ownFocus
label={getControlButtonTitle()}
repositionOnScroll
panelPaddingSize="none"
label={getControlButtonTitle()}
zIndex={Number(euiTheme.levels.header) - 1}
data-test-subj="dashboard-controls-menu-button"
>
{({ closePopover }: { closePopover: () => void }) => (

5
src/plugins/dashboard/public/dashboard_app/top_nav/editor_menu.tsx
View file

@ -14,6 +14,7 @@ import {
EuiContextMenuPanelItemDescriptor,
EuiFlexGroup,
EuiFlexItem,
useEuiTheme,
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { ToolbarPopover } from '@kbn/shared-ux-button-toolbar';
@ -53,6 +54,8 @@ export const EditorMenu = ({ createNewVisType, createNewEmbeddable }: Props) =>
},
} = pluginServices.getServices();
const { euiTheme } = useEuiTheme();
const embeddableFactories = useMemo(
() => Array.from(embeddable.getEmbeddableFactories()),
[embeddable]
@ -262,6 +265,8 @@ export const EditorMenu = ({ createNewVisType, createNewEmbeddable }: Props) =>
};
return (
<ToolbarPopover
zIndex={Number(euiTheme.levels.header) - 1}
repositionOnScroll
ownFocus
label={i18n.translate('dashboard.solutionToolbar.editorMenuButtonLabel', {
defaultMessage: 'Select type',