elk/components/account/AccountPostsFollowers.vue

56 lines
1.4 KiB
Vue
Raw Normal View History

2022-11-28 12:51:15 +03:00
<script setup lang="ts">
2023-01-08 09:21:09 +03:00
import type { mastodon } from 'masto'
2022-11-28 12:51:15 +03:00
defineProps<{
2023-01-08 09:21:09 +03:00
account: mastodon.v1.Account
2022-11-28 12:51:15 +03:00
}>()
</script>
<template>
<div flex gap-5>
<NuxtLink
:to="getAccountRoute(account)"
replace
text-secondary
exact-active-class="text-primary"
>
2022-11-28 13:14:58 +03:00
<template #default="{ isExactActive }">
<CommonLocalizedNumber
keypath="account.posts_count"
:count="account.statusesCount"
font-bold
:class="isExactActive ? 'text-primary' : 'text-base'"
/>
2022-11-28 13:14:58 +03:00
</template>
2022-11-28 12:51:15 +03:00
</NuxtLink>
<NuxtLink
:to="getAccountFollowingRoute(account)"
replace
text-secondary exact-active-class="text-primary"
>
2022-11-28 13:14:58 +03:00
<template #default="{ isExactActive }">
<CommonLocalizedNumber
keypath="account.following_count"
:count="account.followingCount"
font-bold
:class="isExactActive ? 'text-primary' : 'text-base'"
/>
2022-11-28 13:14:58 +03:00
</template>
2022-11-28 12:51:15 +03:00
</NuxtLink>
<NuxtLink
:to="getAccountFollowersRoute(account)"
replace
text-secondary exact-active-class="text-primary"
>
2022-11-28 13:14:58 +03:00
<template #default="{ isExactActive }">
<CommonLocalizedNumber
keypath="account.followers_count"
:count="account.followersCount"
font-bold
:class="isExactActive ? 'text-primary' : 'text-base'"
/>
2022-11-28 13:14:58 +03:00
</template>
2022-11-28 12:51:15 +03:00
</NuxtLink>
</div>
</template>