feat(dashboard): add proxy avatar viewing and editing
This commit is contained in:
parent
66544b9d40
commit
666535fc58
@ -57,6 +57,7 @@ export interface Member {
|
|||||||
birthday?: string;
|
birthday?: string;
|
||||||
pronouns?: string;
|
pronouns?: string;
|
||||||
avatar_url?: string;
|
avatar_url?: string;
|
||||||
|
webhook_avatar_url?: string;
|
||||||
banner?: string;
|
banner?: string;
|
||||||
description?: string;
|
description?: string;
|
||||||
created?: string;
|
created?: string;
|
||||||
|
@ -47,7 +47,10 @@
|
|||||||
|
|
||||||
let bannerOpen = false;
|
let bannerOpen = false;
|
||||||
const toggleBannerModal = () => (bannerOpen = !bannerOpen);
|
const toggleBannerModal = () => (bannerOpen = !bannerOpen);
|
||||||
|
|
||||||
|
let proxyAvatarOpen = false;
|
||||||
|
const toggleProxyAvatarModal = () => (proxyAvatarOpen = !proxyAvatarOpen);
|
||||||
|
|
||||||
let privacyOpen = false;
|
let privacyOpen = false;
|
||||||
const togglePrivacyModal = () => (privacyOpen = !privacyOpen);
|
const togglePrivacyModal = () => (privacyOpen = !privacyOpen);
|
||||||
|
|
||||||
@ -131,6 +134,16 @@
|
|||||||
<b>Color:</b> {member.color}
|
<b>Color:</b> {member.color}
|
||||||
</Col>
|
</Col>
|
||||||
{/if}
|
{/if}
|
||||||
|
{#if member.webhook_avatar_url}
|
||||||
|
<Col xs={12} lg={4} class="mb-2">
|
||||||
|
<b>Proxy Avatar:</b> <Button size="sm" color="secondary" on:click={toggleProxyAvatarModal} aria-label="view member proxy avatar">View</Button>
|
||||||
|
<Modal isOpen={proxyAvatarOpen} toggle={toggleProxyAvatarModal}>
|
||||||
|
<div slot="external" on:click={toggleProxyAvatarModal} style="height: 100%; width: max-content; max-width: 100%; margin-left: auto; margin-right: auto; display: flex;">
|
||||||
|
<img class="img-thumbnail d-block m-auto" src={member.webhook_avatar_url} tabindex={0} alt={`Member ${member.name} proxy avatar (full size)`} use:focus/>
|
||||||
|
</div>
|
||||||
|
</Modal>
|
||||||
|
</Col>
|
||||||
|
{/if}
|
||||||
{#if member.banner}
|
{#if member.banner}
|
||||||
<Col xs={12} lg={4} class="mb-2">
|
<Col xs={12} lg={4} class="mb-2">
|
||||||
<b>Banner:</b> <Button size="sm" color="secondary" on:click={toggleBannerModal} aria-label="view member banner">View</Button>
|
<b>Banner:</b> <Button size="sm" color="secondary" on:click={toggleBannerModal} aria-label="view member banner">View</Button>
|
||||||
|
@ -153,6 +153,10 @@
|
|||||||
<Label>Avatar url:</Label>
|
<Label>Avatar url:</Label>
|
||||||
<Input bind:value={input.avatar_url} maxlength={256} type="url" placeholder={member.avatar_url} aria-label="member avatar url"/>
|
<Input bind:value={input.avatar_url} maxlength={256} type="url" placeholder={member.avatar_url} aria-label="member avatar url"/>
|
||||||
</Col>
|
</Col>
|
||||||
|
<Col xs={12} lg={4} class="mb-2">
|
||||||
|
<Label>Proxy avatar url:</Label>
|
||||||
|
<Input bind:value={input.webhook_avatar_url} maxlength={256} type="url" placeholder={member.webhook_avatar_url} aria-label="member proxy avatar url"/>
|
||||||
|
</Col>
|
||||||
<Col xs={12} lg={4} class="mb-2">
|
<Col xs={12} lg={4} class="mb-2">
|
||||||
<Label>Banner url:</Label>
|
<Label>Banner url:</Label>
|
||||||
<Input bind:value={input.banner} maxlength={256} type="url" placeholder={member.banner} aria-label="member banner url"/>
|
<Input bind:value={input.banner} maxlength={256} type="url" placeholder={member.banner} aria-label="member banner url"/>
|
||||||
|
Loading…
Reference in New Issue
Block a user