Something went wrong. Try again.
Monorepo for Tangled tangled.org
Something went wrong. Try again.
123456789101112131415161718192021222324252627282930313233343536373839404142<script lang="ts"> import { resolve } from "$app/paths"; import type { ResolvedPathname } from "$app/types"; import Avatar from "#lib/components/ui/Avatar.svelte";
interface Props { ownerDid: string; ownerHandle: string; name: string; href: ResolvedPathname; }
let { ownerDid, ownerHandle, name, href }: Props = $props();
const profileHref = $derived(resolve(`/${ownerHandle}` as "/"));</script>
<div class="flex max-w-full items-center gap-xs typography-paragraph-large font-normal"> <a href={profileHref} aria-label={ownerHandle} class="shrink-0"> <Avatar did={ownerDid} handle={ownerHandle} size="large" /> </a> <div class="flex h-lh min-w-0 flex-row-reverse flex-wrap justify-end gap-x-xs overflow-hidden"> <a {href} class="min-w-0 truncate font-bold text-foreground-default no-underline hover:underline" > {name} </a> <span class="flex gap-xs"> <a href={profileHref} tabindex="-1" aria-hidden="true" class="text-foreground-default no-underline hover:underline" > {ownerHandle} </a> <span class="text-foreground-subtle select-none" aria-hidden="true">/</span> </span> </div></div>