diff --git a/src/components/structures/ContextualMenu.js b/src/components/structures/ContextualMenu.js index d551a6fe27..345eae2b18 100644 --- a/src/components/structures/ContextualMenu.js +++ b/src/components/structures/ContextualMenu.js @@ -56,6 +56,7 @@ export default class ContextualMenu extends React.Component { menuPaddingRight: PropTypes.number, menuPaddingBottom: PropTypes.number, menuPaddingLeft: PropTypes.number, + zIndex: PropTypes.number, // If true, insert an invisible screen-sized element behind the // menu that when clicked will close it. @@ -215,16 +216,22 @@ export default class ContextualMenu extends React.Component { menuStyle["paddingRight"] = props.menuPaddingRight; } + const wrapperStyle = {}; + if (!isNaN(Number(props.zIndex))) { + menuStyle["zIndex"] = props.zIndex + 1; + wrapperStyle["zIndex"] = props.zIndex; + } + const ElementClass = props.elementClass; // FIXME: If a menu uses getDefaultProps it clobbers the onFinished // property set here so you can't close the menu from a button click! - return
+ return
{ chevron }
- { props.hasBackground &&
}
; diff --git a/src/components/views/rooms/Stickerpicker.js b/src/components/views/rooms/Stickerpicker.js index 9d8912954c..b487c90ae2 100644 --- a/src/components/views/rooms/Stickerpicker.js +++ b/src/components/views/rooms/Stickerpicker.js @@ -29,9 +29,9 @@ import PersistedElement from "../elements/PersistedElement"; const widgetType = 'm.stickerpicker'; -// We sit in a context menu, so the persisted element container needs to float -// above it, so it needs a greater z-index than the ContextMenu -const STICKERPICKER_Z_INDEX = 5000; +// This should be below the dialog level (4000), but above the rest of the UI (1000-2000). +// We sit in a context menu, so this should be given to the context menu. +const STICKERPICKER_Z_INDEX = 3500; // Key to store the widget's AppTile under in PersistedElement const PERSISTED_ELEMENT_KEY = "stickerPicker"; @@ -367,6 +367,7 @@ export default class Stickerpicker extends React.Component { menuPaddingTop={0} menuPaddingLeft={0} menuPaddingRight={0} + zIndex={STICKERPICKER_Z_INDEX} />; if (this.state.showStickers) {