Fix big date separators when jump to date is enabled (#10404)

Fix https://github.com/vector-im/element-web/issues/22969
This commit is contained in:
Eric Eastwood 2023-03-20 11:03:36 -05:00 committed by GitHub
parent 5b2e12ca0c
commit 7a68bd9cef
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 47 additions and 19 deletions

View file

@ -206,12 +206,14 @@ export default class DateSeparator extends React.Component<IProps, IState> {
return (
<ContextMenuTooltipButton
className="mx_DateSeparator_jumpToDateMenu"
className="mx_DateSeparator_jumpToDateMenu mx_DateSeparator_dateContent"
onClick={this.onContextMenuOpenClick}
isExpanded={!!this.state.contextMenuPosition}
title={_t("Jump to date")}
>
<h2 aria-hidden="true">{this.getLabel()}</h2>
<h2 className="mx_DateSeparator_dateHeading" aria-hidden="true">
{this.getLabel()}
</h2>
<div className="mx_DateSeparator_chevron" />
{contextMenu}
</ContextMenuTooltipButton>
@ -225,7 +227,13 @@ export default class DateSeparator extends React.Component<IProps, IState> {
if (this.state.jumpToDateEnabled) {
dateHeaderContent = this.renderJumpToDateMenu();
} else {
dateHeaderContent = <h2 aria-hidden="true">{label}</h2>;
dateHeaderContent = (
<div className="mx_DateSeparator_dateContent">
<h2 className="mx_DateSeparator_dateHeading" aria-hidden="true">
{label}
</h2>
</div>
);
}
// ARIA treats <hr/>s as separators, here we abuse them slightly so manually treat this entire thing as one