Show a 'grab' cursor on picture-in-picture view (#33079)

* Remove unused 'draggable' prop from PictureInPictureDragger

* Show a 'grab' cursor on picture-in-picture view

To give it a proper affordance for dragging.
This commit is contained in:
Robin
2026-04-09 14:25:14 +02:00
committed by GitHub
parent 70e40009a3
commit 253dcb44dd
7 changed files with 32 additions and 51 deletions
+1 -1
View File
@@ -70,6 +70,7 @@
@import "./structures/_MatrixChat.pcss";
@import "./structures/_MessagePanel.pcss";
@import "./structures/_NonUrgentToastContainer.pcss";
@import "./structures/_PictureInPictureDragger.pcss";
@import "./structures/_QuickSettingsButton.pcss";
@import "./structures/_RightPanel.pcss";
@import "./structures/_RoomSearch.pcss";
@@ -375,7 +376,6 @@
@import "./views/voip/_DialPad.pcss";
@import "./views/voip/_DialPadContextMenu.pcss";
@import "./views/voip/_DialPadModal.pcss";
@import "./views/voip/_LegacyCallPreview.pcss";
@import "./views/voip/_LegacyCallView.pcss";
@import "./views/voip/_LegacyCallViewForRoom.pcss";
@import "./views/voip/_LegacyCallViewHeader.pcss";
@@ -0,0 +1,20 @@
/*
Copyright 2026 Element Creations Ltd.
SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial
Please see LICENSE files in the repository root for full details.
*/
.mx_PictureInPictureDragger {
cursor: grab;
user-select: none;
left: 0;
position: fixed;
top: 0;
/* Display above any widget elements */
z-index: 102;
}
.mx_PictureInPictureDragger:active {
cursor: grabbing;
}
@@ -1,28 +0,0 @@
/*
Copyright 2024 New Vector Ltd.
Copyright 2021 Šimon Brandner <simon.bra.ag@gmail.com>
SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial
Please see LICENSE files in the repository root for full details.
*/
.mx_LegacyCallPreview {
align-items: flex-end;
display: flex;
flex-direction: column;
gap: $spacing-16;
left: 0;
position: fixed;
top: 0;
/* Display above any widget elements */
z-index: 102;
.mx_VideoFeed_remote.mx_VideoFeed_voice {
min-height: 150px;
}
.mx_VideoFeed_local {
border-radius: 8px;
overflow: hidden;
}
}