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 console.log(account);
5 import { Config } from "../../config";
6</script>
7
8<button class="accountBtn" type="button" popovertarget="{account.handle.replace('.')}" title="{account.handle}">
9 <div class="accountContainer">
10 {#if account.avatarCid}
11 <img
12 class="avatar"
13 alt="avatar of {account.displayName}"
14 width="24"
15 height="24"
16 src="{Config.PDS_URL}/xrpc/com.atproto.sync.getBlob?did={account.did}&cid={account.avatarCid}"
17 />
18 {:else}
19 <img
20 class="avatar"
21 alt="no avatar for {account.displayName}"
22 width="24"
23 height="24"
24 src=""
25 />
26 {/if}
27 </div>
28 <div class="accountTooltip" popover id="{account.handle.replace('.')}">
29 <div class="banner">
30 <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" />
31 <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" />
32 </div>
33 <div class="displayName">{account.displayName}</div>
34 <div class="handle"><a href="{Config.FRONTEND_URL}/profile/{account.did}" target="_blank">{account.handle}</a></div>
35 <div class="desc">{account.description}</div>
36 </div>
37</button>