diff --git a/src/lib/AccountComponent.svelte b/src/lib/AccountComponent.svelte index 880db3f..01ac750 100644 --- a/src/lib/AccountComponent.svelte +++ b/src/lib/AccountComponent.svelte @@ -12,10 +12,14 @@ alt="avatar of {account.displayName}" src="{Config.PDS_URL}/xrpc/com.atproto.sync.getBlob?did={account.did}&cid={account.avatarCid}" /> + <div id="accountName"> + {account.displayName || account.handle || account.did} + </div> + {:else} + <div id="accountName" class="no-avatar"> + {account.displayName || account.handle || account.did} + </div> {/if} - <div id="accountName"> - {account.displayName || account.handle || account.did} - </div> </div> </a> @@ -28,6 +32,7 @@ padding: 0px; margin-bottom: 15px; border: 1px solid var(--border-color); + min-height: 50px; } #accountName { margin-left: 10px; @@ -39,6 +44,9 @@ text-overflow: ellipsis; white-space: nowrap; } + .no-avatar { + margin-left: 60px !important; + } #avatar { width: 50px; height: 50px;