Mizah/mizzkey
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

chore: disable sampling for cat ears (#10513)

Browse source 
* chore: sample 3px for cat ears

* fix: typo

* chore: disable avatar plot for cat ears
This commit is contained in:
Acid Chicken (硫酸鶏) 2023-04-08 15:22:39 +09:00 committed by GitHub
parent 1aa8f09b95
commit 33e9428510
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 33 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
packages/frontend/src/components/global/MkAvatar.vue
View file

@ -4,12 +4,16 @@
<MkUserOnlineIndicator v-if="indicator" :class="$style.indicator" :user="user"/> <MkUserOnlineIndicator v-if="indicator" :class="$style.indicator" :user="user"/>
<div v-if="user.isCat" :class="[$style.ears, { [$style.mask]: useBlurEffect }]"> <div v-if="user.isCat" :class="[$style.ears, { [$style.mask]: useBlurEffect }]">
<div :class="$style.earLeft"> <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 :class="$style.plot" :style="{ backgroundImage: `url(${JSON.stringify(url)})` }"/>
</div> </div>
</div> </div>
<div :class="$style.earRight"> <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 :class="$style.plot" :style="{ backgroundImage: `url(${JSON.stringify(url)})` }"/>
</div> </div>
</div> </div>
@ -195,11 +199,21 @@ watch(() => props.user.avatarBlurhash, () => {
> .plot { > .plot {
contain: strict; contain: strict;
position: absolute;
width: 100%; width: 100%;
height: 100%; height: 100%;
clip-path: path('M0 0H1V1H0z'); clip-path: path('M0 0H1V1H0z');
transform: scale(32767); transform: scale(32767);
transform-origin: 0 0; 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 { > .plot {
background-position: 20% 10%; /* ~= 37.5deg */ 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) */ -38.5857864376%); /* 40 - 2 * sqrt(2) */
> .plot { > .plot {
position: absolute;
background-position: 80% 10%; /* ~= 37.5deg */ background-position: 80% 10%; /* ~= 37.5deg */
&:first-child {
background-position-x: 79%;
}
&:last-child {
background-position-y: 11%;
}
} }
} }
} }