matrix/matrix-react-sdk
1
0
Fork 0
mirror of https://github.com/matrix-org/matrix-react-sdk.git synced 2025-11-03 00:33:22 +03:00
Code Activity

Fix room list scroll jumps (#7991)

Browse Source 
Signed-off-by: Robin Townsend <robin@robin.town>
This commit is contained in:
Robin
2022-03-09 13:18:17 -05:00
committed by GitHub
parent 14684c6296
commit 7b71a9fb65
2 changed files with 33 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
res/css/views/rooms/_RoomSublist.scss
View File

@@ -50,6 +50,10 @@ limitations under the License.
height: 24px;
color: $tertiary-content;
.mx_RoomSublist_stickableContainer {
width: 100%;
}
.mx_RoomSublist_stickable {
flex: 1;
max-width: 100%;
@@ -176,6 +180,14 @@ limitations under the License.
}
}
// In the general case, we reserve space for each sublist header to prevent
// scroll jumps when they become sticky. However, that leaves a gap when
// scrolled to the top above the first sublist (whose header can only ever
// stick to top), so we make sure to exclude the first visible sublist.
&:not(.mx_RoomSublist_hidden) ~ .mx_RoomSublist .mx_RoomSublist_stickableContainer {
height: 24px;
}
.mx_RoomSublist_resizeBox {
position: relative;

2
src/components/views/rooms/RoomSublist.tsx
View File

@@ -698,6 +698,7 @@ export default class RoomSublist extends React.Component<IProps, IState> {
onFocus={onFocus}
aria-label={this.props.label}
>
<div className="mx_RoomSublist_stickableContainer">
<div className="mx_RoomSublist_stickable">
<Button
onFocus={onFocus}
@@ -718,6 +719,7 @@ export default class RoomSublist extends React.Component<IProps, IState> {
{ this.props.isMinimized ? null : badgeContainer }
{ this.props.isMinimized ? null : addRoomButton }
</div>
</div>
{ this.props.isMinimized ? badgeContainer : null }
{ this.props.isMinimized ? addRoomButton : null }
</div>