X-Git-Url: https://git.arvados.org/arvados.git/blobdiff_plain/5382a72a72279b40641fdf98bee2eb2b16108bbe..e9856c5b1fc9162ce1f105fee49e2a80d69dd397:/services/workbench2/src/components/multiselect-toolbar/ms-toolbar-overflow-menu.tsx diff --git a/services/workbench2/src/components/multiselect-toolbar/ms-toolbar-overflow-menu.tsx b/services/workbench2/src/components/multiselect-toolbar/ms-toolbar-overflow-menu.tsx index 207b341b1b..9f8ced940d 100644 --- a/services/workbench2/src/components/multiselect-toolbar/ms-toolbar-overflow-menu.tsx +++ b/services/workbench2/src/components/multiselect-toolbar/ms-toolbar-overflow-menu.tsx @@ -8,7 +8,7 @@ import classnames from 'classnames'; import { IconButton, Menu, MenuItem, StyleRulesCallback, Tooltip, WithStyles, withStyles } from '@material-ui/core'; import { ArvadosTheme } from 'common/custom-theme'; -type CssRules = 'inOverflowMenu' | 'openMenuButton' | 'menu'; +type CssRules = 'inOverflowMenu' | 'openMenuButton' | 'menu' | 'menuItem' | 'menuElement'; const styles: StyleRulesCallback = (theme: ArvadosTheme) => ({ inOverflowMenu: { @@ -20,6 +20,19 @@ const styles: StyleRulesCallback = (theme: ArvadosTheme) => ({ right: '10px', }, menu: { + marginLeft: 0, + }, + menuItem: { + '&:hover': { + backgroundColor: 'white', + }, + marginTop: 0, + paddingTop: 0, + paddingLeft: '1rem', + height: '2.5rem', + }, + menuElement: { + width: '2rem', } }); @@ -66,6 +79,8 @@ export const OverflowMenu = withStyles(styles)((props: OverflowMenuProps & WithS keepMounted open={open} onClose={handleClose} + disableAutoFocusItem + className={classes.menu} > {React.Children.map(children, (child: any) => { if (!visibilityMap[child.props['data-targetid']]) { @@ -73,9 +88,10 @@ export const OverflowMenu = withStyles(styles)((props: OverflowMenuProps & WithS {React.cloneElement(child, { - className: classnames(child.className, classes.inOverflowMenu), + className: classnames(classes.menuElement), })} );