Skip to content

Commit

Permalink
fix: Popover position (#1410)
Browse files Browse the repository at this point in the history
Before, the popover was portaled. It worked well
in a normal context, but not when we only have
a portal like a Modal.

The idea, is to display the popover in the
component calling it and put it in a fixed
position (we can't have an absolute one
since Modals for instance are fixed...).

We set the right zIndex to this popover to be well
displayed.

The drawback of this method, is that the Popover
doesn't follow the scroll anymore. But we already
have this behavior in our old Menu. I think we can
deal with it, the time we find a solution.
  • Loading branch information
Crash-- authored Mar 19, 2020
1 parent 0cf2c7e commit 92cccc2
Showing 1 changed file with 6 additions and 1 deletion.
7 changes: 6 additions & 1 deletion react/ActionMenu/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { Media, Bd, Img } from '../Media'
import BottomDrawer from '../BottomDrawer'
import withBreakpoints from '../helpers/withBreakpoints'
import Popper from '@material-ui/core/Popper'

import { getCssVariableValue } from '../utils/color'
const ActionMenuWrapper = ({
inline,
onClose,
Expand All @@ -30,6 +30,11 @@ const ActionMenuWrapper = ({
modifiers={preventOverflow ? null : normalOverflowModifiers}
open
placement={placement}
disablePortal={true}
style={{
position: 'fixed',
zIndex: getCssVariableValue('zIndex-popover')
}}
>
<ClickAwayListener onClickAway={onClose}>{children}</ClickAwayListener>
</Popper>
Expand Down

0 comments on commit 92cccc2

Please sign in to comment.