versia-pub/frontend
2
0
Fork 0
mirror of https://github.com/versia-pub/frontend.git synced 2026-06-14 15:39:15 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

chore: ⬆️ Upgrade to Nuxt 4
Some checks failed
CodeQL / Analyze (javascript) (push) Failing after 1s
Details
Deploy to GitHub Pages / build (push) Failing after 1s
Details
Deploy to GitHub Pages / deploy (push) Has been skipped
Details
Docker / build (push) Failing after 1s
Details
Mirror to Codeberg / Mirror (push) Failing after 1s
Details

Browse source
This commit is contained in:
Jesse Wierzbinski 2025-07-16 07:48:39 +02:00
parent 8debe97f63
commit 7f7cf20311
386 changed files with 2376 additions and 2332 deletions
Download patch file Download diff file Expand all files Collapse all files

60
app/components/profiles/small-card.vue Normal file
View file

@ -0,0 +1,60 @@
<template>
<div class="relative">
<div class="bg-muted rounded overflow-hidden h-32 w-full">
<img
:src="account.header"
alt=""
class="object-cover w-full h-full"
/>
<!-- Shadow overlay at the bottom -->
<div
class="absolute bottom-0 w-full h-1/3 bg-gradient-to-b from-black/0 to-black/40"
></div>
</div>
<div
class="absolute bottom-0 left-1/2 translate-y-1/3 -translate-x-1/2 flex flex-row items-start gap-2"
>
<Avatar
size="base"
class="border"
:src="account.avatar"
:name="account.display_name"
/>
</div>
</div>
<div class="flex flex-col justify-center items-center mt-8">
<Text class="font-bold" v-render-emojis="account.emojis">
{{ account.display_name }}
</Text>
<Address :username="username" :domain="domain" />
</div>
<Html
v-html="account.note"
v-render-emojis="account.emojis"
class="mt-4 max-h-72 overflow-y-auto"
/>
<Separator v-if="account.fields.length > 0" class="mt-4" />
<ProfileFields
v-if="account.fields.length > 0"
:fields="account.fields"
:emojis="account.emojis"
class="mt-4 max-h-48 overflow-y-auto"
/>
</template>
<script lang="ts" setup>
import type { Account } from "@versia/client/schemas";
import type { z } from "zod";
import { Separator } from "~/components/ui/separator";
import Html from "../typography/html.vue";
import Text from "../typography/text.vue";
import Address from "./address.vue";
import Avatar from "./avatar.vue";
import ProfileFields from "./profile-fields.vue";
const { account } = defineProps<{
account: z.infer<typeof Account>;
}>();
const [username, domain] = account.acct.split("@");
</script>