OpenCloud
/
element-web
mirror of https://github.com/vector-im/element-web
1
0
Fork 0
Code Issues Releases Wiki Activity

Fix format bar position (#28591)

pull/28600/head
Florian Duros 2024-11-29 12:56:52 +01:00 committed by GitHub
parent d68c5a26af
commit 2b4ce627b8
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 7 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/views/rooms/MessageComposerFormatBar.tsx
View File

@ -33,6 +33,12 @@ interface IState {
export default class MessageComposerFormatBar extends React.PureComponent<IProps, IState> { export default class MessageComposerFormatBar extends React.PureComponent<IProps, IState> {
private readonly formatBarRef = createRef<HTMLDivElement>(); private readonly formatBarRef = createRef<HTMLDivElement>();
/**
* The height of the format bar in pixels.
* Height 32px + 2px border
* @private
*/
private readonly BAR_HEIGHT = 34;
public constructor(props: IProps) { public constructor(props: IProps) {
super(props); super(props);
@ -96,7 +102,7 @@ export default class MessageComposerFormatBar extends React.PureComponent<IProps
this.setState({ visible: true }); this.setState({ visible: true });
const parentRect = this.formatBarRef.current.parentElement.getBoundingClientRect(); const parentRect = this.formatBarRef.current.parentElement.getBoundingClientRect();
this.formatBarRef.current.style.left = `${selectionRect.left - parentRect.left}px`; this.formatBarRef.current.style.left = `${selectionRect.left - parentRect.left}px`;
const halfBarHeight = this.formatBarRef.current.clientHeight / 2; // used to center the bar const halfBarHeight = this.BAR_HEIGHT / 2; // used to center the bar
const offset = halfBarHeight + 2; // makes sure the bar won't cover selected text const offset = halfBarHeight + 2; // makes sure the bar won't cover selected text
const offsetLimit = halfBarHeight + offset; const offsetLimit = halfBarHeight + offset;
const position = Math.max(selectionRect.top - parentRect.top - offsetLimit, -offsetLimit); const position = Math.max(selectionRect.top - parentRect.top - offsetLimit, -offsetLimit);