PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Align message context menu to right

Browse source 
This changes the message context menu to align the right edge of the menu with
the right edge of the button that opens it, which should keep all menu options
inside the viewport, even if they are very wide.

Part of https://github.com/vector-im/riot-web/issues/9624
This commit is contained in:
J. Ryan Stinnett 2019-06-10 16:12:23 +01:00
parent 3126880345
commit 0355c91797
1 changed files with 4 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
src/components/views/messages/MessageActionBar.js
View file

@ -71,7 +71,7 @@ export default class MessageActionBar extends React.PureComponent {
// The window X and Y offsets are to adjust position when zoomed in to page // The window X and Y offsets are to adjust position when zoomed in to page
const x = buttonRect.right + window.pageXOffset; const x = buttonRect.right + window.pageXOffset;
const y = (buttonRect.top + (buttonRect.height / 2) + window.pageYOffset) - 19; const y = buttonRect.bottom + window.pageYOffset;
const { getTile, getReplyThread } = this.props; const { getTile, getReplyThread } = this.props;
const tile = getTile && getTile(); const tile = getTile && getTile();
@ -83,9 +83,10 @@ export default class MessageActionBar extends React.PureComponent {
} }
createMenu(MessageContextMenu, { createMenu(MessageContextMenu, {
chevronOffset: 10,
mxEvent: this.props.mxEvent, mxEvent: this.props.mxEvent,
left: x, chevronFace: "none",
// Align the right edge of the menu to the right edge of the button
right: window.innerWidth - x,
top: y, top: y,
permalinkCreator: this.props.permalinkCreator, permalinkCreator: this.props.permalinkCreator,
eventTileOps: tile && tile.getEventTileOps ? tile.getEventTileOps() : undefined, eventTileOps: tile && tile.getEventTileOps ? tile.getEventTileOps() : undefined,