From c0ddb3ac925dd791fff3633de9d1c68a5f44ee97 Mon Sep 17 00:00:00 2001
From: Mansvini Aggarwal <coderspecial@gmail.com>
Date: Sun, 7 Apr 2024 18:41:11 +0530
Subject: [PATCH 1/2] Update UI of error state in form

Signed-off-by: Mansvini Aggarwal <coderspecial@gmail.com>
---
 .../src/components/Form.svelte                | 22 ++++++++++---------
 1 file changed, 12 insertions(+), 10 deletions(-)

diff --git a/plugins/login-resources/src/components/Form.svelte b/plugins/login-resources/src/components/Form.svelte
index 7f86b7a642a..c709f9f2ad1 100644
--- a/plugins/login-resources/src/components/Form.svelte
+++ b/plugins/login-resources/src/components/Form.svelte
@@ -66,7 +66,7 @@
 
   $: $themeStore.language && validate($themeStore.language)
 
-  async function validate (language: string): Promise<boolean> {
+  async function validate(language: string): Promise<boolean> {
     if (ignoreInitialValidation) return true
     for (const field of fields) {
       const v = object[field.name]
@@ -106,7 +106,7 @@
 
   let inAction = false
 
-  function performAction (action: Action): void {
+  function performAction(action: Action): void {
     for (const field of fields) {
       trim(field.name)
     }
@@ -117,7 +117,7 @@
   }
   onMount(() => (ignoreInitialValidation = false))
 
-  function trim (field: string): void {
+  function trim(field: string): void {
     object[field] = (object[field] as string).trim()
   }
 
@@ -175,9 +175,6 @@
     {/if}
     <div class="title"><Label label={caption} /></div>
   {/if}
-  <div class="status">
-    <StatusControl {status} />
-  </div>
   <div class="form">
     {#each fields as field (field.name)}
       <div class={field.short && !($deviceInfo.docWidth <= 600) ? 'form-col' : 'form-row'}>
@@ -194,6 +191,10 @@
       </div>
     {/each}
 
+    <div class="status">
+      <StatusControl {status} />
+    </div>
+
     <div class="form-row send">
       <Button
         label={action.i18n}
@@ -275,9 +276,9 @@
       }
     }
     .status {
-      min-height: 7.5rem;
-      max-height: 7.5rem;
-      padding-top: 1.25rem;
+      padding-top: 1rem;
+      grid-column-start: 1;
+      grid-column-end: 3;
     }
 
     .form {
@@ -285,6 +286,7 @@
       grid-template-columns: 1fr 1fr;
       column-gap: 0.75rem;
       row-gap: 1.5rem;
+      margin-top: 1.5rem;
 
       .form-row {
         grid-column-start: 1;
@@ -298,7 +300,7 @@
       }
 
       .send {
-        margin-top: 2.25rem;
+        margin-top: 0rem;
       }
     }
     .grow-separator {

From b71d9b5954ca624fbe416566e9ecca0197817b98 Mon Sep 17 00:00:00 2001
From: Mansvini Aggarwal <coderspecial@gmail.com>
Date: Wed, 10 Apr 2024 00:19:45 +0530
Subject: [PATCH 2/2] Reverting whitespaces in function definitions in
 Form.svelte

Signed-off-by: Mansvini Aggarwal <coderspecial@gmail.com>
---
 plugins/login-resources/src/components/Form.svelte | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/plugins/login-resources/src/components/Form.svelte b/plugins/login-resources/src/components/Form.svelte
index c709f9f2ad1..76023391443 100644
--- a/plugins/login-resources/src/components/Form.svelte
+++ b/plugins/login-resources/src/components/Form.svelte
@@ -66,7 +66,7 @@
 
   $: $themeStore.language && validate($themeStore.language)
 
-  async function validate(language: string): Promise<boolean> {
+  async function validate (language: string): Promise<boolean> {
     if (ignoreInitialValidation) return true
     for (const field of fields) {
       const v = object[field.name]
@@ -106,7 +106,7 @@
 
   let inAction = false
 
-  function performAction(action: Action): void {
+  function performAction (action: Action): void {
     for (const field of fields) {
       trim(field.name)
     }
@@ -117,7 +117,7 @@
   }
   onMount(() => (ignoreInitialValidation = false))
 
-  function trim(field: string): void {
+  function trim (field: string): void {
     object[field] = (object[field] as string).trim()
   }