From 6dd7b18bb2f76c30789baa088db1657db44a1abf Mon Sep 17 00:00:00 2001
From: Steven Nguyen <stnguyen90@users.noreply.github.com>
Date: Mon, 13 Nov 2023 15:19:11 -0800
Subject: [PATCH] Update label permission modal

---
 src/lib/components/permissions/label.svelte | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/src/lib/components/permissions/label.svelte b/src/lib/components/permissions/label.svelte
index 531c25284..b927b544f 100644
--- a/src/lib/components/permissions/label.svelte
+++ b/src/lib/components/permissions/label.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-    import { Button, FormList, Helper, InputText } from '$lib/elements/forms';
+    import { Button, FormItem, FormList, Helper, InputText } from '$lib/elements/forms';
     import { createEventDispatcher } from 'svelte';
     import { Modal } from '..';
     import type { Writable } from 'svelte/store';
@@ -32,12 +32,18 @@
     $: disabled = !value || $groups.has(value);
 </script>
 
-<Modal title="Label" bind:show on:close={reset} onSubmit={create}>
-    <p class="text">Labels allow you to grant access to users with the specfied label.</p>
+<Modal
+    title="Label"
+    description="Labels allow you to grant access to users with the specfied label."
+    bind:show
+    on:close={reset}
+    onSubmit={create}>
     <FormList>
-        <InputText showLabel={false} id="label" label="Label" placeholder="admin" bind:value />
-        <Helper type={isError ? 'warning' : 'neutral'}
-            >Only alphanumeric characters are allowed.</Helper>
+        <FormItem>
+            <InputText id="label" label="Label" placeholder="Enter label" bind:value />
+            <Helper type={isError ? 'warning' : 'neutral'}
+                >Only alphanumeric characters are allowed.</Helper>
+        </FormItem>
     </FormList>
 
     <svelte:fragment slot="footer">