mirror of
https://github.com/element-hq/element-web
synced 2024-11-25 18:55:58 +03:00
Fix consistent avatar output for Percy (#11472)
* Fix consistent avatar output for Percy * Fix last room in list clipped Fixes https://github.com/vector-im/element-web/issues/26049 * Fix decorated avatar indicator centering Fixes https://github.com/vector-im/element-web/issues/26052 * Fix uploader centering
This commit is contained in:
parent
c6d9228f94
commit
64f762d7b0
3 changed files with 7 additions and 5 deletions
|
@ -19,5 +19,6 @@ limitations under the License.
|
||||||
/* Stick the default room avatar colour, so it doesn't cause a false diff on the screenshot */
|
/* Stick the default room avatar colour, so it doesn't cause a false diff on the screenshot */
|
||||||
.mx_BaseAvatar {
|
.mx_BaseAvatar {
|
||||||
background-color: var(--percy-color-avatar) !important;
|
background-color: var(--percy-color-avatar) !important;
|
||||||
|
color: white !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -18,7 +18,7 @@ limitations under the License.
|
||||||
.mx_ExtraTile {
|
.mx_ExtraTile {
|
||||||
position: relative;
|
position: relative;
|
||||||
contain: content;
|
contain: content;
|
||||||
line-height: 1;
|
line-height: 0;
|
||||||
|
|
||||||
&.mx_DecoratedRoomAvatar_cutout .mx_BaseAvatar {
|
&.mx_DecoratedRoomAvatar_cutout .mx_BaseAvatar {
|
||||||
mask-image: url("$(res)/img/element-icons/roomlist/decorated-avatar-mask.svg");
|
mask-image: url("$(res)/img/element-icons/roomlist/decorated-avatar-mask.svg");
|
||||||
|
@ -30,10 +30,9 @@ limitations under the License.
|
||||||
.mx_DecoratedRoomAvatar_icon {
|
.mx_DecoratedRoomAvatar_icon {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
/* the following percentage based sizings are to match the scalable svg mask for the cutout */
|
/* the following percentage based sizings are to match the scalable svg mask for the cutout */
|
||||||
bottom: 0;
|
bottom: 6.25%; // 2px for a 32x32 avatar
|
||||||
right: 0;
|
right: 6.25%;
|
||||||
transform: translate(-25%, -70%);
|
width: 25%; // 8px for a 32x32 avatar
|
||||||
width: 25%;
|
|
||||||
height: 25%;
|
height: 25%;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
}
|
}
|
||||||
|
|
|
@ -43,6 +43,8 @@ limitations under the License.
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
|
|
||||||
|
line-height: 0;
|
||||||
|
|
||||||
.mx_MiniAvatarUploader_cameraIcon {
|
.mx_MiniAvatarUploader_cameraIcon {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
Loading…
Reference in a new issue