MrUnknownDE/VRCX
1
0
Fork 0
mirror of https://github.com/MrUnknownDE/VRCX.git synced 2026-04-28 19:23:47 +02:00
Code Issues Packages Projects Releases Wiki Activity

Clean up status icon

Browse Source
This commit is contained in:
Natsumi
2026-03-01 17:35:15 +11:00
committed by pa
parent 18e3f48329
commit 339b7d5ae9
2 changed files with 55 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
src/app.css
View File

@@ -83,7 +83,8 @@ img.friends-list-avatar {
border-radius: 2px;
}
.x-friend-item > .avatar > img {
.x-friend-item > .avatar > img,
.x-friend-item > .avatar > .avatar > img {
width: 100%;
height: 100%;
border-radius: 50%;
@@ -91,51 +92,36 @@ img.friends-list-avatar {
background-color: transparent;
}
.x-friend-item > .avatar.active > img {
.x-friend-item .active img,
.x-friend-item .offline img {
filter: grayscale(1);
}
.x-friend-item:hover > .avatar.offline > img,
.x-friend-item:hover > .avatar.active > img {
.x-friend-item:hover .active img,
.x-friend-item:hover .offline img {
filter: none;
}
.x-friend-item > .avatar.online.mobile > img,
.x-friend-item > .avatar.joinme.mobile > img,
.x-friend-item > .avatar.askme.mobile > img,
.x-friend-item > .avatar.busy.mobile > img {
.x-friend-item .status-icon.mobile img {
mask-image: url(/images/masks/usercutoutmobile.svg);
}
.x-friend-item > .avatar.online.mobile::after,
.x-friend-item > .avatar.joinme.mobile::after,
.x-friend-item > .avatar.askme.mobile::after,
.x-friend-item > .avatar.busy.mobile::after {
.x-friend-item .status-icon.mobile::after {
position: absolute;
right: -2px;
bottom: 0px;
bottom: -0.5px;
width: 14px;
height: 14px;
content: '';
border-radius: 0px;
mask-image: url(/images/masks/phone.svg);
mask-image: url(/images/masks/phone.svg) !important;
}
.x-friend-item > .avatar.active > img,
.x-friend-item > .avatar.online > img,
.x-friend-item > .avatar.joinme > img,
.x-friend-item > .avatar.askme > img,
.x-friend-item > .avatar.busy > img,
.x-friend-item > .avatar.offline > img {
.x-friend-item .status-icon img {
mask-image: url(/images/masks/usercutout.svg);
}
.x-friend-item > .avatar.active::after,
.x-friend-item > .avatar.online::after,
.x-friend-item > .avatar.joinme::after,
.x-friend-item > .avatar.askme::after,
.x-friend-item > .avatar.busy::after,
.x-friend-item > .avatar.offline::after {
.x-friend-item .status-icon::after {
position: absolute;
right: 0.75px;
bottom: 0.75px;
@@ -146,37 +132,33 @@ img.friends-list-avatar {
border-radius: 50%;
}
.x-friend-item > .avatar.active::after {
.x-friend-item .status-icon.active::after {
background: #f4e05e;
}
.x-friend-item > .avatar.online::after {
.x-friend-item .status-icon.online::after {
background: #67c23a;
}
.x-friend-item > .avatar.joinme::after {
.x-friend-item .status-icon.joinme::after {
background: #00b8ff;
mask-image: url(/images/masks/joinme.svg);
}
.x-friend-item > .avatar.askme::after {
.x-friend-item .status-icon.askme::after {
background: #ff9500;
mask-image: url(/images/masks/askme.svg);
}
.x-friend-item > .avatar.busy::after {
.x-friend-item .status-icon.busy::after {
background: #ff2c2c;
mask-image: url(/images/masks/busy.svg);
}
.x-friend-item > .avatar.offline::after {
.x-friend-item .status-icon.offline::after {
background: #909399;
}
.x-friend-item.offline > .avatar::after {
display: none;
}
.x-friend-item > .detail {
flex: 1;
overflow: hidden;