zio/elk
2
0
Fork 0
Code Releases 2 Packages 1 Activity

ui: improve hover card motion

Browse source
This commit is contained in:
Anthony Fu 2022-11-25 21:58:49 +08:00
parent fd410010ca
commit b8ce2fc62b
4 changed files with 12 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

12
components/account/AccountAvatar.vue
View file

@ -14,10 +14,18 @@ defineOptions({
<template>
<div v-if="hover" relative flex-shrink-0>
<div group>
<AccountHoverCard top="-3.2" left="-4.4" absolute :account="account" op0 pointer-events-none group-hover="pointer-events-auto op100 scale-100" font-normal delay-250 transition transform scale-20 class="ease-[cubic-bezier(0.4, 0.0, 0.2, 1)]" />
<AccountHoverCard
:account="account"
absolute top-0 left-0 z-10
op0 pointer-events-none rotate--2
font-normal delay-300 duration-300 transition transform
group-hover="pointer-events-auto op100 rotate-0"
translate="x-[calc(-1rem-1px)] y-[calc(-1rem-1px)]"
class="ease-[cubic-bezier(0.4, 0.0, 0.2, 1)]"
style="transform-origin: calc(1rem + 1px) calc(0.75rem + 1px);"
/>
<AccountAvatarImage :account="account" v-bind="$attrs" />
</div>
</div>
<AccountAvatarImage v-else :account="account" v-bind="$attrs" />
</template>