Make autocomplete pop-up wider in thread view (#9289)

* Make autocomplete pop-up wider in thread view

* Handle non-narrow mode too
t3chguy/dedup-icons-17oct
Michael Telatynski 2022-09-16 10:12:28 +01:00 committed by GitHub
parent a0c35d088a
commit 4bfb1e7b2f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 1 deletions

View File

@ -84,6 +84,14 @@ limitations under the License.
.mx_MessageComposer_sendMessage { .mx_MessageComposer_sendMessage {
margin-right: 0; margin-right: 0;
} }
// Make use of the space above the composer buttons too
.mx_Autocomplete {
width: calc(100% + 140px);
}
&.mx_ThreadView_narrow .mx_Autocomplete {
width: calc(100% + 108px);
}
} }
.mx_RoomView_messagePanel { /* To avoid the rule from being applied to .mx_ThreadPanel_empty */ .mx_RoomView_messagePanel { /* To avoid the rule from being applied to .mx_ThreadPanel_empty */

View File

@ -22,6 +22,7 @@ import { TimelineWindow } from 'matrix-js-sdk/src/timeline-window';
import { Direction } from 'matrix-js-sdk/src/models/event-timeline'; import { Direction } from 'matrix-js-sdk/src/models/event-timeline';
import { IRelationsRequestOpts } from 'matrix-js-sdk/src/@types/requests'; import { IRelationsRequestOpts } from 'matrix-js-sdk/src/@types/requests';
import { logger } from 'matrix-js-sdk/src/logger'; import { logger } from 'matrix-js-sdk/src/logger';
import classNames from 'classnames';
import BaseCard from "../views/right_panel/BaseCard"; import BaseCard from "../views/right_panel/BaseCard";
import { RightPanelPhases } from "../../stores/right-panel/RightPanelStorePhases"; import { RightPanelPhases } from "../../stores/right-panel/RightPanelStorePhases";
@ -366,7 +367,9 @@ export default class ThreadView extends React.Component<IProps, IState> {
narrow: this.state.narrow, narrow: this.state.narrow,
}}> }}>
<BaseCard <BaseCard
className="mx_ThreadView mx_ThreadPanel" className={classNames("mx_ThreadView mx_ThreadPanel", {
mx_ThreadView_narrow: this.state.narrow,
})}
onClose={this.props.onClose} onClose={this.props.onClose}
withoutScrollContainer={true} withoutScrollContainer={true}
header={this.renderThreadViewHeader()} header={this.renderThreadViewHeader()}