From 60914e11c4f1bf78bb8a09a4faf3144064c4e809 Mon Sep 17 00:00:00 2001
From: KoloMl <thekolomoets@hotmail.com>
Date: Sun, 7 Jul 2024 19:09:19 +0400
Subject: [PATCH] Moved styling of the `textarea` inside `FormControl`

---
 src/components/ui/forms/FormControl.svelte            |  9 +++++++++
 .../settings/maintenance/[id]/export/+page.svelte     | 11 ++++-------
 2 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/src/components/ui/forms/FormControl.svelte b/src/components/ui/forms/FormControl.svelte
index fccc6c3..b9cda8f 100644
--- a/src/components/ui/forms/FormControl.svelte
+++ b/src/components/ui/forms/FormControl.svelte
@@ -12,5 +12,14 @@
 </label>
 
 <style lang="scss">
+    .label {
+        margin-bottom: .5em;
+    }
 
+    .control {
+        :global(textarea) {
+            width: 100%;
+            resize: vertical;
+        }
+    }
 </style>
diff --git a/src/routes/settings/maintenance/[id]/export/+page.svelte b/src/routes/settings/maintenance/[id]/export/+page.svelte
index edb8226..014d38c 100644
--- a/src/routes/settings/maintenance/[id]/export/+page.svelte
+++ b/src/routes/settings/maintenance/[id]/export/+page.svelte
@@ -5,6 +5,7 @@
     import Menu from "$components/ui/menu/Menu.svelte";
     import MenuItem from "$components/ui/menu/MenuItem.svelte";
     import FormContainer from "$components/ui/forms/FormContainer.svelte";
+    import FormControl from "$components/ui/forms/FormControl.svelte";
 
     const profileId = $page.params.id;
 
@@ -35,7 +36,9 @@
     <hr>
 </Menu>
 <FormContainer>
-    <textarea readonly rows="6">{isCompressedProfileShown ? compressedProfile : exportedProfile}</textarea>
+    <FormControl label="Export string">
+        <textarea readonly rows="6">{isCompressedProfileShown ? compressedProfile : exportedProfile}</textarea>
+    </FormControl>
 </FormContainer>
 <Menu>
     <hr>
@@ -48,9 +51,3 @@
         {/if}
     </MenuItem>
 </Menu>
-
-<style lang="scss">
-    textarea {
-        resize: vertical;
-    }
-</style>