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

Fix tooltip towards right side of screen going wrong direction

Browse source 
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2020-07-17 17:09:43 +01:00
parent 4380ebcbb8
commit a8f5731c07
1 changed files with 9 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/components/views/elements/Tooltip.tsx
View file

@ -18,7 +18,7 @@ limitations under the License.
*/ */
import React, { Component } from 'react'; import React, {Component, CSSProperties} from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom';
import classNames from 'classnames'; import classNames from 'classnames';
@ -70,7 +70,7 @@ export default class Tooltip extends React.Component<IProps> {
window.removeEventListener('scroll', this.renderTooltip, true); window.removeEventListener('scroll', this.renderTooltip, true);
} }
private updatePosition(style: {[key: string]: any}) { private updatePosition(style: CSSProperties) {
const parentBox = this.parent.getBoundingClientRect(); const parentBox = this.parent.getBoundingClientRect();
let offset = 0; let offset = 0;
if (parentBox.height > MIN_TOOLTIP_HEIGHT) { if (parentBox.height > MIN_TOOLTIP_HEIGHT) {
@ -80,8 +80,14 @@ export default class Tooltip extends React.Component<IProps> {
// we need so that we're still centered. // we need so that we're still centered.
offset = Math.floor(parentBox.height - MIN_TOOLTIP_HEIGHT); offset = Math.floor(parentBox.height - MIN_TOOLTIP_HEIGHT);
} }
style.top = (parentBox.top - 2) + window.pageYOffset + offset; style.top = (parentBox.top - 2) + window.pageYOffset + offset;
style.left = 6 + parentBox.right + window.pageXOffset; if (parentBox.right > window.innerWidth / 2) {
style.right = window.innerWidth - parentBox.right - window.pageXOffset - 8;
} else {
style.left = parentBox.right + window.pageXOffset + 6;
}
return style; return style;
} }