diff options
| author | syuilo <Syuilotan@yahoo.co.jp> | 2023-04-08 15:53:39 +0900 |
|---|---|---|
| committer | syuilo <Syuilotan@yahoo.co.jp> | 2023-04-08 15:53:39 +0900 |
| commit | eefa06622b67b8a923408e5bfae2361b5555eebc (patch) | |
| tree | eab7524d8714b7189a8b38d0287a1341b2df6c1a /packages/frontend/src/components | |
| parent | feat(backend): support replication of postgresql (diff) | |
| parent | chore: disable sampling for cat ears (#10513) (diff) | |
| download | misskey-eefa06622b67b8a923408e5bfae2361b5555eebc.tar.gz misskey-eefa06622b67b8a923408e5bfae2361b5555eebc.tar.bz2 misskey-eefa06622b67b8a923408e5bfae2361b5555eebc.zip | |
Merge branch 'develop' of https://github.com/misskey-dev/misskey into develop
Diffstat (limited to 'packages/frontend/src/components')
| -rw-r--r-- | packages/frontend/src/components/global/MkAvatar.vue | 35 |
1 files changed, 33 insertions, 2 deletions
diff --git a/packages/frontend/src/components/global/MkAvatar.vue b/packages/frontend/src/components/global/MkAvatar.vue index 0cc30a887f..8497b8443b 100644 --- a/packages/frontend/src/components/global/MkAvatar.vue +++ b/packages/frontend/src/components/global/MkAvatar.vue @@ -4,12 +4,16 @@ <MkUserOnlineIndicator v-if="indicator" :class="$style.indicator" :user="user"/> <div v-if="user.isCat" :class="[$style.ears, { [$style.mask]: useBlurEffect }]"> <div :class="$style.earLeft"> - <div v-if="useBlurEffect" :class="$style.layer"> + <div v-if="false" :class="$style.layer"> + <div :class="$style.plot" :style="{ backgroundImage: `url(${JSON.stringify(url)})` }"/> + <div :class="$style.plot" :style="{ backgroundImage: `url(${JSON.stringify(url)})` }"/> <div :class="$style.plot" :style="{ backgroundImage: `url(${JSON.stringify(url)})` }"/> </div> </div> <div :class="$style.earRight"> - <div v-if="useBlurEffect" :class="$style.layer"> + <div v-if="false" :class="$style.layer"> + <div :class="$style.plot" :style="{ backgroundImage: `url(${JSON.stringify(url)})` }"/> + <div :class="$style.plot" :style="{ backgroundImage: `url(${JSON.stringify(url)})` }"/> <div :class="$style.plot" :style="{ backgroundImage: `url(${JSON.stringify(url)})` }"/> </div> </div> @@ -195,11 +199,21 @@ watch(() => props.user.avatarBlurhash, () => { > .plot { contain: strict; + position: absolute; width: 100%; height: 100%; clip-path: path('M0 0H1V1H0z'); transform: scale(32767); transform-origin: 0 0; + opacity: 0.5; + + &:first-child { + opacity: 1; + } + + &:last-child { + opacity: calc(1 / 3); + } } } } @@ -221,6 +235,14 @@ watch(() => props.user.avatarBlurhash, () => { > .plot { background-position: 20% 10%; /* ~= 37.5deg */ + + &:first-child { + background-position-x: 21%; + } + + &:last-child { + background-position-y: 11%; + } } } } @@ -241,7 +263,16 @@ watch(() => props.user.avatarBlurhash, () => { -38.5857864376%); /* 40 - 2 * sqrt(2) */ > .plot { + position: absolute; background-position: 80% 10%; /* ~= 37.5deg */ + + &:first-child { + background-position-x: 79%; + } + + &:last-child { + background-position-y: 11%; + } } } } |