diff options
| author | syuilo <4439005+syuilo@users.noreply.github.com> | 2024-08-20 10:51:02 +0900 |
|---|---|---|
| committer | syuilo <4439005+syuilo@users.noreply.github.com> | 2024-08-20 10:51:02 +0900 |
| commit | 1b5f0571f71dd7b50fd99bd2de0d0e168225e180 (patch) | |
| tree | 93d07634558bf2cebcdb0fce5bac599fa268760b /packages/frontend/src/components | |
| parent | refactor (diff) | |
| download | misskey-1b5f0571f71dd7b50fd99bd2de0d0e168225e180.tar.gz misskey-1b5f0571f71dd7b50fd99bd2de0d0e168225e180.tar.bz2 misskey-1b5f0571f71dd7b50fd99bd2de0d0e168225e180.zip | |
:art:
Diffstat (limited to 'packages/frontend/src/components')
| -rw-r--r-- | packages/frontend/src/components/global/MkAvatar.vue | 17 |
1 files changed, 15 insertions, 2 deletions
diff --git a/packages/frontend/src/components/global/MkAvatar.vue b/packages/frontend/src/components/global/MkAvatar.vue index e8e1bc696b..ee224dba49 100644 --- a/packages/frontend/src/components/global/MkAvatar.vue +++ b/packages/frontend/src/components/global/MkAvatar.vue @@ -26,7 +26,7 @@ SPDX-License-Identifier: AGPL-3.0-only <template v-if="showDecoration"> <img v-for="decoration in decorations ?? user.avatarDecorations" - :class="[$style.decoration]" + :class="[$style.decoration, { [$style.decorationBlink]: decoration.blink }]" :src="getDecorationUrl(decoration)" :style="{ rotate: getDecorationAngle(decoration), @@ -60,7 +60,7 @@ const props = withDefaults(defineProps<{ link?: boolean; preview?: boolean; indicator?: boolean; - decorations?: Omit<Misskey.entities.UserDetailed['avatarDecorations'][number], 'id'>[]; + decorations?: (Omit<Misskey.entities.UserDetailed['avatarDecorations'][number], 'id'> & { blink?: boolean; })[]; forceShowDecoration?: boolean; }>(), { target: null, @@ -330,4 +330,17 @@ watch(() => props.user.avatarBlurhash, () => { width: 200%; pointer-events: none; } + +.decorationBlink { + animation: blink 1s infinite; +} + +@keyframes blink { + 0%, 100% { + filter: brightness(2); + } + 50% { + filter: brightness(1); + } +} </style> |