mirror of
https://github.com/element-hq/element-web
synced 2024-11-27 19:56:47 +03:00
Merge pull request #2863 from matrix-org/travis/stickerpicker/lower-z
Put the stickerpicker below dialogs
This commit is contained in:
commit
8225b91179
2 changed files with 13 additions and 5 deletions
|
@ -56,6 +56,7 @@ export default class ContextualMenu extends React.Component {
|
||||||
menuPaddingRight: PropTypes.number,
|
menuPaddingRight: PropTypes.number,
|
||||||
menuPaddingBottom: PropTypes.number,
|
menuPaddingBottom: PropTypes.number,
|
||||||
menuPaddingLeft: PropTypes.number,
|
menuPaddingLeft: PropTypes.number,
|
||||||
|
zIndex: PropTypes.number,
|
||||||
|
|
||||||
// If true, insert an invisible screen-sized element behind the
|
// If true, insert an invisible screen-sized element behind the
|
||||||
// menu that when clicked will close it.
|
// menu that when clicked will close it.
|
||||||
|
@ -215,16 +216,22 @@ export default class ContextualMenu extends React.Component {
|
||||||
menuStyle["paddingRight"] = props.menuPaddingRight;
|
menuStyle["paddingRight"] = props.menuPaddingRight;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const wrapperStyle = {};
|
||||||
|
if (!isNaN(Number(props.zIndex))) {
|
||||||
|
menuStyle["zIndex"] = props.zIndex + 1;
|
||||||
|
wrapperStyle["zIndex"] = props.zIndex;
|
||||||
|
}
|
||||||
|
|
||||||
const ElementClass = props.elementClass;
|
const ElementClass = props.elementClass;
|
||||||
|
|
||||||
// FIXME: If a menu uses getDefaultProps it clobbers the onFinished
|
// FIXME: If a menu uses getDefaultProps it clobbers the onFinished
|
||||||
// property set here so you can't close the menu from a button click!
|
// property set here so you can't close the menu from a button click!
|
||||||
return <div className={className} style={position}>
|
return <div className={className} style={{...position, ...wrapperStyle}}>
|
||||||
<div className={menuClasses} style={menuStyle} ref={this.collectContextMenuRect}>
|
<div className={menuClasses} style={menuStyle} ref={this.collectContextMenuRect}>
|
||||||
{ chevron }
|
{ chevron }
|
||||||
<ElementClass {...props} onFinished={props.closeMenu} onResize={props.windowResize} />
|
<ElementClass {...props} onFinished={props.closeMenu} onResize={props.windowResize} />
|
||||||
</div>
|
</div>
|
||||||
{ props.hasBackground && <div className="mx_ContextualMenu_background"
|
{ props.hasBackground && <div className="mx_ContextualMenu_background" style={wrapperStyle}
|
||||||
onClick={props.closeMenu} onContextMenu={this.onContextMenu} /> }
|
onClick={props.closeMenu} onContextMenu={this.onContextMenu} /> }
|
||||||
<style>{ chevronCSS }</style>
|
<style>{ chevronCSS }</style>
|
||||||
</div>;
|
</div>;
|
||||||
|
|
|
@ -29,9 +29,9 @@ import PersistedElement from "../elements/PersistedElement";
|
||||||
|
|
||||||
const widgetType = 'm.stickerpicker';
|
const widgetType = 'm.stickerpicker';
|
||||||
|
|
||||||
// We sit in a context menu, so the persisted element container needs to float
|
// This should be below the dialog level (4000), but above the rest of the UI (1000-2000).
|
||||||
// above it, so it needs a greater z-index than the ContextMenu
|
// We sit in a context menu, so this should be given to the context menu.
|
||||||
const STICKERPICKER_Z_INDEX = 5000;
|
const STICKERPICKER_Z_INDEX = 3500;
|
||||||
|
|
||||||
// Key to store the widget's AppTile under in PersistedElement
|
// Key to store the widget's AppTile under in PersistedElement
|
||||||
const PERSISTED_ELEMENT_KEY = "stickerPicker";
|
const PERSISTED_ELEMENT_KEY = "stickerPicker";
|
||||||
|
@ -367,6 +367,7 @@ export default class Stickerpicker extends React.Component {
|
||||||
menuPaddingTop={0}
|
menuPaddingTop={0}
|
||||||
menuPaddingLeft={0}
|
menuPaddingLeft={0}
|
||||||
menuPaddingRight={0}
|
menuPaddingRight={0}
|
||||||
|
zIndex={STICKERPICKER_Z_INDEX}
|
||||||
/>;
|
/>;
|
||||||
|
|
||||||
if (this.state.showStickers) {
|
if (this.state.showStickers) {
|
||||||
|
|
Loading…
Reference in a new issue