mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web synced 2024-11-23 09:46:09 +03:00
Code Issues Projects Releases Packages Wiki Activity

Fix field tooltips

Browse source 
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2020-07-18 11:36:23 +01:00
parent e75b33c66c
commit c980b58c69
3 changed files with 15 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
res/css/views/elements/_Tooltip.scss
View file

@ -81,6 +81,18 @@ limitations under the License.
}
}
// These tooltips use an older style with a chevron
.mx_Field_tooltip {
background-color: $menu-bg-color;
color: $primary-fg-color;
border: 1px solid $menu-border-color;
text-align: unset;
.mx_Tooltip_chevron {
display: unset;
}
}
.mx_Tooltip_title {
font-weight: 600;
}

1
src/components/views/elements/Field.tsx
View file

@ -248,6 +248,7 @@ export default class Field extends React.PureComponent<PropShapes, IState> {
tooltipClassName={classNames("mx_Field_tooltip", tooltipClassName)}
visible={(this.state.focused && this.props.forceTooltipVisible) || this.state.feedbackVisible}
label={tooltipContent || this.state.feedback}
forceOnRight
/>;
}

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

@ -35,6 +35,7 @@ interface IProps {
visible?: boolean;
// the react element to put into the tooltip
label: React.ReactNode;
forceOnRight?: boolean;
}
export default class Tooltip extends React.Component<IProps> {
@ -82,7 +83,7 @@ export default class Tooltip extends React.Component<IProps> {
}
style.top = (parentBox.top - 2) + window.pageYOffset + offset;
if (parentBox.right > window.innerWidth / 2) {
if (!this.props.forceOnRight && parentBox.right > window.innerWidth / 2) {
style.right = window.innerWidth - parentBox.right - window.pageXOffset - 8;
} else {
style.left = parentBox.right + window.pageXOffset + 6;