pds dash for shimaenaga.veryroundbird.house (based off of pds.witchcraft.systems)
veryroundbird.house
1<script lang="ts">
2 import type { AccountMetadata } from "./pdsfetch";
3 const { account }: { account: AccountMetadata } = $props();
4 import { Config } from "../../config";
5</script>
6
7<button class="accountBtn" type="button" popovertarget="{account.handle.replace('.', '')}" title="{account.handle}">
8 <div class="accountContainer">
9 {#if account.avatarCid}
10 <img
11 class="avatar"
12 alt="avatar of {account.displayName}"
13 width="24"
14 height="24"
15 src="{Config.PDS_URL}/xrpc/com.atproto.sync.getBlob?did={account.did}&cid={account.avatarCid}"
16 />
17 {:else}
18 <img
19 class="avatar"
20 alt="no avatar for {account.displayName}"
21 width="24"
22 height="24"
23 src=""
24 />
25 {/if}
26 </div>
27 <div class="accountTooltip" popover id="{account.handle.replace('.', '')}">
28 <div class="banner">
29 <img class="bannerImg" src="{Config.PDS_URL}/xrpc/com.atproto.sync.getBlob?did={account.did}&cid={account.bannerCid}" alt="{account.displayName}'s banner" width="300" height="100" />
30 <img class="avatarInsetImg" src="{Config.PDS_URL}/xrpc/com.atproto.sync.getBlob?did={account.did}&cid={account.avatarCid}" alt="{account.displayName}'s avatar" width="50" height="50" />
31 </div>
32 <div class="displayName">{account.displayName}</div>
33 <div class="handle"><a href="{Config.FRONTEND_URL}/profile/{account.did}" target="_blank">{account.handle}</a></div>
34 <div class="desc">{account.description}</div>
35 </div>
36</button>