merge: Feat: Implement "Show Below Avatar" for Avatar Decorations (!645)

View MR for information: https://activitypub.software/TransFem-org/Sharkey/-/merge_requests/645

Approved-by: dakkar <dakkar@thenautilus.net>
Approved-by: Marie <github@yuugi.dev>
This commit is contained in:
Marie 2024-10-03 20:40:34 +00:00
commit ac1e5a0fb5
12 changed files with 36 additions and 1 deletions

View file

@ -32,6 +32,7 @@ SPDX-License-Identifier: AGPL-3.0-only
rotate: getDecorationAngle(decoration),
scale: getDecorationScale(decoration),
translate: getDecorationOffset(decoration),
zIndex: getDecorationZIndex(decoration),
}"
alt=""
>
@ -113,6 +114,10 @@ function getDecorationOffset(decoration: Omit<Misskey.entities.UserDetailed['ava
return offsetX === 0 && offsetY === 0 ? undefined : `${offsetX * 100}% ${offsetY * 100}%`;
}
function getDecorationZIndex(decoration: Omit<Misskey.entities.UserDetailed['avatarDecorations'][number], 'id'>) {
return decoration.showBelow ? '-1' : undefined;
}
const color = ref<string | undefined>();
watch(() => props.user.avatarBlurhash, () => {
@ -159,6 +164,7 @@ watch(() => props.user.avatarBlurhash, () => {
flex-shrink: 0;
border-radius: 100%; // sharkey: controlled by square avatars setting!
line-height: 16px;
z-index: 0; // sharkey: starts stacking context to help with showing decorations behind the avatar
}
.inner {