TZGyn
/
kon.sh
mirror of https://github.com/TZGyn/shortener
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

update project settings page danger zone ui

Browse Source
main
TZGyn 1 year ago
parent 5cb8d24db7
commit 6f3510143c
Signed by: TZGyn
GPG Key ID: 122EAF77AE81FD4A
2 changed files with 66 additions and 51 deletions
Show Stats Download Patch File Download Diff File

2
frontend/src/app.postcss
Unescape Escape View File

@ -28,7 +28,7 @@
--accent: 240 4.8% 95.9%; --accent: 240 4.8% 95.9%;
--accent-foreground: 240 5.9% 10%; --accent-foreground: 240 5.9% 10%;
--destructive: 0 84.2% 60.2%; --destructive: #c20e4d;
--destructive-foreground: 0 0% 98%; --destructive-foreground: 0 0% 98%;
--ring: 240 4.8% 95.9%; --ring: 240 4.8% 95.9%;

115
frontend/src/routes/(app)/projects/[id]/settings/+page.svelte
Unescape Escape View File

@ -50,57 +50,72 @@
<div> <div>
<h3 class="text-lg font-medium">Danger Zone</h3> <h3 class="text-lg font-medium">Danger Zone</h3>
</div> </div>
<div> <div class="rounded-lg border border-destructive">
<Dialog.Root <div class="flex justify-between items-center p-4">
open={deleteDialogOpen} <div class="flex flex-col gap-1">
onOpenChange={(open) => (deleteDialogOpen = open)}> <span class="text-sm">Delete Project</span>
<Dialog.Trigger> <span class="text-xs text-muted-foreground"
<Button variant="destructive">Delete Project</Button> >Permanently delete your project</span>
</Dialog.Trigger> </div>
<Dialog.Content> <Dialog.Root
<Dialog.Header> open={deleteDialogOpen}
<Dialog.Title>Are you sure absolutely sure?</Dialog.Title> onOpenChange={(open) => (deleteDialogOpen = open)}>
<Dialog.Description> <Dialog.Trigger>
This action cannot be undone. This will permanently <Button
delete your project and all its associated data. variant="default"
</Dialog.Description> class="group hover:bg-destructive">
</Dialog.Header> <span class="text-destructive group-hover:text-primary"
<form method="POST" action="?/delete" use:enhance> >Delete Project</span>
<Form.Field </Button>
{form} </Dialog.Trigger>
name="deleteShorteners" <Dialog.Content>
class="flex flex-col gap-2"> <Dialog.Header>
<Form.Control let:attrs> <Dialog.Title>
<Input Are you sure absolutely sure?
{...attrs} </Dialog.Title>
bind:value={$formData.deleteShorteners} <Dialog.Description>
type="hidden" /> This action cannot be undone. This will permanently
<div class="flex gap-2 items-center"> delete your project and all its associated data.
<Checkbox </Dialog.Description>
</Dialog.Header>
<form method="POST" action="?/delete" use:enhance>
<Form.Field
{form}
name="deleteShorteners"
class="flex flex-col gap-2">
<Form.Control let:attrs>
<Input
{...attrs} {...attrs}
id="deleteShorteners" bind:value={$formData.deleteShorteners}
bind:checked={$formData.deleteShorteners} /> type="hidden" />
<Form.Label for="deleteShorteners" <div class="flex gap-2 items-center">
>Delete Shorteners</Form.Label> <Checkbox
</div> {...attrs}
</Form.Control> id="deleteShorteners"
<Form.FieldErrors /> bind:checked={$formData.deleteShorteners} />
</Form.Field> <Form.Label for="deleteShorteners">
<div class="flex gap-2 justify-end"> Delete Shorteners?
<Button </Form.Label>
variant="outline" </div>
on:click={() => (deleteDialogOpen = false)} </Form.Control>
>Cancel</Button> <Form.FieldErrors />
<Form.Button variant="destructive" class="w-fit"> </Form.Field>
{#if $submitting} <div class="flex gap-2 justify-end">
<LoaderCircle class="animate-spin" /> <Button
{/if} variant="outline"
Delete on:click={() => (deleteDialogOpen = false)}
</Form.Button> >Cancel</Button>
</div> <Form.Button variant="destructive" class="w-fit">
</form> {#if $submitting}
</Dialog.Content> <LoaderCircle class="animate-spin" />
</Dialog.Root> {/if}
Delete
</Form.Button>
</div>
</form>
</Dialog.Content>
</Dialog.Root>
</div>
</div> </div>
</div> </div>
</ScrollArea> </ScrollArea>

Write Preview
Loading…
Cancel
Save