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

feat: add account hover card (#80)

Browse source 
Co-authored-by: 三咲智子 Kevin Deng <sxzz@sxzz.moe>
This commit is contained in:
wheat 2022-11-25 03:21:53 -05:00 • committed by GitHub
parent 4505080ba8
commit 410d41a0a8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 39 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

33
components/account/AccountHoverCard.vue Normal file
View file

@ -0,0 +1,33 @@
<script setup lang="ts">
import type { Account } from 'masto'
defineProps<{
account: Account
}>()
</script>
<template>
<div bg-base border="~ base" rounded w-80 z-900 overflow-hidden p-4 class="account-hover-card">
<AccountInfo :account="account" />
<div text-sm flex flex-row text-gray mt-4>
<NuxtLink :to="`/${getAccountHandle(account)}/`">
{{ account.statusesCount }} Posts
</NuxtLink>
<span flex-1 text-center> • </span>
<NuxtLink :to="`/${getAccountHandle(account)}/following`">
{{ account.followingCount }} Following
</NuxtLink>
<span flex-1 text-center> • </span>
<NuxtLink :to="`/${getAccountHandle(account)}/followers`">
{{ account.followersCount }} Followers
</NuxtLink>
</div>
<ContentRichSetup text-4 text-gray :content="account.note" :emojis="account.emojis" />
</div>
</template>
<style>
.account-hover-card {
transform-origin: 3em 3em;
}
</style>