Skip to content
This repository was archived by the owner on Sep 11, 2024. It is now read-only.

Commit 64f762d

Browse files
author
Germain
authored
Fix consistent avatar output for Percy (#11472)
* Fix consistent avatar output for Percy * Fix last room in list clipped Fixes element-hq/element-web#26049 * Fix decorated avatar indicator centering Fixes element-hq/element-web#26052 * Fix uploader centering
1 parent c6d9228 commit 64f762d

File tree

3 files changed

+7
-5
lines changed

3 files changed

+7
-5
lines changed

res/css/views/avatars/_BaseAvatar.pcss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,5 +19,6 @@ limitations under the License.
1919
/* Stick the default room avatar colour, so it doesn't cause a false diff on the screenshot */
2020
.mx_BaseAvatar {
2121
background-color: var(--percy-color-avatar) !important;
22+
color: white !important;
2223
}
2324
}

res/css/views/avatars/_DecoratedRoomAvatar.pcss

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ limitations under the License.
1818
.mx_ExtraTile {
1919
position: relative;
2020
contain: content;
21-
line-height: 1;
21+
line-height: 0;
2222

2323
&.mx_DecoratedRoomAvatar_cutout .mx_BaseAvatar {
2424
mask-image: url("$(res)/img/element-icons/roomlist/decorated-avatar-mask.svg");
@@ -30,10 +30,9 @@ limitations under the License.
3030
.mx_DecoratedRoomAvatar_icon {
3131
position: absolute;
3232
/* the following percentage based sizings are to match the scalable svg mask for the cutout */
33-
bottom: 0;
34-
right: 0;
35-
transform: translate(-25%, -70%);
36-
width: 25%;
33+
bottom: 6.25%; // 2px for a 32x32 avatar
34+
right: 6.25%;
35+
width: 25%; // 8px for a 32x32 avatar
3736
height: 25%;
3837
border-radius: 50%;
3938
}

res/css/views/elements/_MiniAvatarUploader.pcss

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,8 @@ limitations under the License.
4343
border-radius: 50%;
4444
z-index: 1;
4545

46+
line-height: 0;
47+
4648
.mx_MiniAvatarUploader_cameraIcon {
4749
height: 100%;
4850
width: 100%;

0 commit comments

Comments
 (0)