07d5a72f26
* feat: add video call and EC call to room list item vm * feat: add video call notification decoration to notification decoration component * feat: add video call support to room list item view * feat: add new RoomAvatarView component * feat: deprecate `DecoratedRoomAvatar` * feat: use `RoomAvatarView` in room list item * feat: allow custom class for `RoomAvatar` * test: update notification decoration * test: update room list item view * test: update room list snapshot * test: add tests for room avatar vm * test: add tests for room avatar view * test(e2e): update snapshots * fix: video room creation rights * test: e2e add test for public and video room
49 lines
1.4 KiB
Plaintext
49 lines
1.4 KiB
Plaintext
/*
|
|
* Copyright 2025 New Vector 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_RoomAvatarView {
|
|
--room-avatar-size: 32px;
|
|
|
|
position: relative;
|
|
|
|
/* Keep the container to the same size than the avatar */
|
|
inline-size: var(--room-avatar-size);
|
|
block-size: var(--room-avatar-size);
|
|
|
|
.mx_RoomAvatarView_RoomAvatar {
|
|
mask-position: center;
|
|
mask-size: contain;
|
|
mask-repeat: no-repeat;
|
|
}
|
|
|
|
.mx_RoomAvatarView_RoomAvatar_icon {
|
|
mask-image: url("$(res)/img/element-icons/roomlist/room-avatar-view-icon-mask.svg");
|
|
}
|
|
|
|
.mx_RoomAvatarView_RoomAvatar_presence {
|
|
mask-image: url("$(res)/img/element-icons/roomlist/room-avatar-view-presence-mask.svg");
|
|
}
|
|
|
|
.mx_RoomAvatarView_icon {
|
|
position: absolute;
|
|
|
|
/* Place half the icon inside the avatar */
|
|
/* Avatar size - (icon size (16px) / 2) */
|
|
left: calc((var(--room-avatar-size) - 8px));
|
|
bottom: var(--cpd-space-0-5x);
|
|
}
|
|
|
|
.mx_RoomAvatarView_PresenceDecoration {
|
|
position: absolute;
|
|
|
|
/* Place half the icon inside the avatar */
|
|
/* Avatar size - (icon size (8px) / 2) */
|
|
left: calc((var(--room-avatar-size) - 4px));
|
|
bottom: var(--cpd-space-0-5x);
|
|
}
|
|
}
|