mirrors/pronouns.cc
1
0
Fork 1
mirror of https://codeberg.org/pronounscc/pronouns.cc.git synced 2024-11-20 14:19:52 +01:00
Code Issues Projects Releases Packages Wiki Activity

feat: add button to remove existing user/member avatar

Browse source
This commit is contained in:
Sam 2023-03-19 01:37:59 +01:00
parent 77ae15a468
commit 7d8bb1023e
No known key found for this signature in database
GPG key ID: B4EF20DDE721CAA1
3 changed files with 20 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
frontend/src/routes/edit/EditableField.svelte
View file

@ -47,7 +47,6 @@
tooltip="Move field right"
click={() => moveField(false)}
/>
<!-- <InputGroupText>Name</InputGroupText> -->
<Input bind:value={field.name} />
<Button color="danger" on:click={() => deleteField()}>Delete field</Button>
</InputGroup>

5
frontend/src/routes/edit/member/[id]/+page.svelte
View file

@ -317,7 +317,9 @@
<h4>Avatar</h4>
<div class="row">
<div class="col-md text-center">
{#if avatar}
{#if avatar === ""}
<FallbackImage alt="Current avatar" urls={[]} width={200} />
{:else if avatar}
<img width={200} src={avatar} alt="New avatar" class="rounded-circle img-fluid" />
{:else}
<FallbackImage alt="Current avatar" urls={memberAvatars(data.member)} width={200} />
@ -335,6 +337,7 @@
<Icon name="info-circle-fill" /> Only PNG, JPEG, GIF, and WebP can be used as avatars.
Avatars cannot be larger than 1 MB, and animated avatars will be made static.
</p>
<a href="" on:click={() => (avatar = "")}>Remove avatar</a>
</div>
</div>
</div>

29
frontend/src/routes/edit/profile/+page.svelte
View file

@ -12,15 +12,7 @@
} from "$lib/api/entities";
import FallbackImage from "$lib/components/FallbackImage.svelte";
import { userStore } from "$lib/store";
import {
Alert,
Button,
ButtonDropdown,
DropdownToggle,
FormGroup,
Icon,
Input,
} from "sveltestrap";
import { Alert, Button, ButtonGroup, FormGroup, Icon, Input } from "sveltestrap";
import { encode } from "base64-arraybuffer";
import { apiFetchClient } from "$lib/api/fetch";
import IconButton from "$lib/components/IconButton.svelte";
@ -248,9 +240,15 @@
<h1>
Edit profile
{#if modified}
<Button color="success" on:click={() => updateUser()}>Save changes</Button>
{/if}
<ButtonGroup>
<Button color="secondary" href="/@{$userStore?.name}">
<Icon name="chevron-left" />
Back to your profile
</Button>
{#if modified}
<Button color="success" on:click={() => updateUser()}>Save changes</Button>
{/if}
</ButtonGroup>
</h1>
{#if error}
@ -266,7 +264,9 @@
<h4>Avatar</h4>
<div class="row">
<div class="col-md text-center">
{#if avatar}
{#if avatar === ""}
<FallbackImage alt="Current avatar" urls={[]} width={200} />
{:else if avatar}
<img width={200} src={avatar} alt="New avatar" class="rounded-circle img-fluid" />
{:else}
<FallbackImage alt="Current avatar" urls={userAvatars($userStore)} width={200} />
@ -284,6 +284,9 @@
<Icon name="info-circle-fill" /> Only PNG, JPEG, GIF, and WebP images can be used as avatars.
Avatars cannot be larger than 1 MB, and animated avatars will be made static.
</p>
<p>
<a href="" on:click={() => (avatar = "")}>Remove avatar</a>
</p>
</div>
</div>
</div>