From 245b215b224738b8856ddc34abe036a4d40fb4f7 Mon Sep 17 00:00:00 2001
From: Darshan <itznotabug@gmail.com>
Date: Fri, 12 Sep 2025 16:30:36 +0530
Subject: [PATCH 1/4] update: more centering constraints.

---
 .../table-[table]/layout/emptySheet.svelte        | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/emptySheet.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/emptySheet.svelte
index 2f7db8290..17ae79b2b 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/emptySheet.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/emptySheet.svelte
@@ -359,6 +359,21 @@
         bottom: 35%;
         position: fixed;
 
+        @media (max-width: 768px) and (max-height: 768px) {
+            left: unset;
+            bottom: 12.5% !important;
+        }
+
+        @media (max-width: 768px) and (max-height: 1024px) {
+            left: unset;
+            bottom: 15% !important;
+        }
+
+        @media (max-width: 1024px) and (max-height: 1024px) {
+            left: unset;
+            bottom: 15%;
+        }
+
         @media (max-width: 1024px) {
             left: unset;
             bottom: 30%;

From 739b41c0c3dfa4ec1f4eaa4fa6ec75cc7d3e3a5f Mon Sep 17 00:00:00 2001
From: Darshan <itznotabug@gmail.com>
Date: Fri, 12 Sep 2025 18:16:53 +0530
Subject: [PATCH 2/4] fix: actions not showing on footer.

---
 .../table-[table]/layout/sidesheet.svelte     | 77 ++++++++++++-------
 1 file changed, 51 insertions(+), 26 deletions(-)

diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/sidesheet.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/sidesheet.svelte
index 59064ab85..9d167b79e 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/sidesheet.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/sidesheet.svelte
@@ -3,6 +3,8 @@
     import { Button, Form } from '$lib/elements/forms';
     import { Badge, Divider, Layout, Sheet, Tag, Typography } from '@appwrite.io/pink-svelte';
     import { Copy } from '$lib/components';
+    import { writable } from 'svelte/store';
+    import { isTabletViewport } from '$lib/stores/viewport';
 
     let {
         show = $bindable(false),
@@ -38,6 +40,9 @@
         footer?: Snippet | null;
     } = $props();
 
+    let form: Form;
+    let submitting = writable(false);
+
     let copyText = $state(undefined);
 </script>
 
@@ -72,8 +77,10 @@
             </Layout.Stack>
         </div>
 
-        <Layout.Stack direction="column" justifyContent="space-evenly">
+        <Layout.Stack direction="column" justifyContent="space-evenly" gap="xxxl">
             <Form
+                bind:this={form}
+                bind:isSubmitting={submitting}
                 onSubmit={async () => {
                     try {
                         const keepOpen = await submit?.onClick?.();
@@ -87,32 +94,38 @@
                 <Layout.Stack gap="xl" class="sheet-content">
                     {@render children?.()}
                 </Layout.Stack>
-
-                {#if submit}
-                    <div class="sheet-footer">
-                        <Layout.Stack gap="l">
-                            <Divider />
-
-                            <div class="sheet-footer-actions">
-                                <Layout.Stack
-                                    gap="m"
-                                    direction="row"
-                                    justifyContent="flex-end"
-                                    alignItems="center">
-                                    {#if footer}
-                                        {@render footer?.()}
-                                    {/if}
-                                    <Button size="s" secondary on:click={() => (show = false)}
-                                        >Cancel</Button>
-                                    <Button size="s" submit disabled={submit.disabled}>
-                                        {submit.text}
-                                    </Button>
-                                </Layout.Stack>
-                            </div>
-                        </Layout.Stack>
-                    </div>
-                {/if}
             </Form>
+
+            {#if submit}
+                <div class="sheet-footer">
+                    <Layout.Stack gap="l">
+                        <Divider />
+
+                        <div class="sheet-footer-actions">
+                            <Layout.Stack
+                                gap="m"
+                                direction="row"
+                                justifyContent="flex-end"
+                                alignItems="center">
+                                {#if footer}
+                                    {@render footer?.()}
+                                {/if}
+                                <Button size="s" secondary on:click={() => (show = false)}
+                                    >Cancel</Button>
+                                <Button
+                                    size="s"
+                                    submit
+                                    disabled={submit.disabled || $submitting}
+                                    forceShowLoader={$submitting && $isTabletViewport}
+                                    submissionLoader={$submitting && $isTabletViewport}
+                                    on:click={() => (form?.triggerSubmit())}>
+                                    {submit.text}
+                                </Button>
+                            </Layout.Stack>
+                        </div>
+                    </Layout.Stack>
+                </div>
+            {/if}
         </Layout.Stack>
     </Sheet>
 </div>
@@ -131,6 +144,14 @@
         & :global(.sheet-content) {
             // overflow-y: auto;
             padding-bottom: 5rem;
+
+            @media (max-width: 768px) {
+                /*
+                 * different mobile browsers handle bottom spaces differently,
+                 * therefore, having extra bottom space doesn't hurt anyone imo!
+                 */
+                padding-bottom: 15rem;
+            }
         }
     }
 
@@ -141,6 +162,10 @@
         position: absolute;
         background: var(--bgcolor-neutral-primary);
 
+        @media (max-width: 768px) {
+            position: fixed;
+        }
+
         & .sheet-footer-actions {
             padding-inline: var(--space-8);
             padding-block-end: var(--space-6);

From 95ede84bc3eb6064d6bccc674dcd2616fbb418cb Mon Sep 17 00:00:00 2001
From: Darshan <itznotabug@gmail.com>
Date: Fri, 12 Sep 2025 18:32:34 +0530
Subject: [PATCH 3/4] lint.

---
 .../database-[database]/table-[table]/layout/sidesheet.svelte   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/sidesheet.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/sidesheet.svelte
index 9d167b79e..028d5cd18 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/sidesheet.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/sidesheet.svelte
@@ -118,7 +118,7 @@
                                     disabled={submit.disabled || $submitting}
                                     forceShowLoader={$submitting && $isTabletViewport}
                                     submissionLoader={$submitting && $isTabletViewport}
-                                    on:click={() => (form?.triggerSubmit())}>
+                                    on:click={() => form?.triggerSubmit()}>
                                     {submit.text}
                                 </Button>
                             </Layout.Stack>

From 89a940447ba4dbae408ebd2448b13659692cebc2 Mon Sep 17 00:00:00 2001
From: Darshan <itznotabug@gmail.com>
Date: Fri, 12 Sep 2025 18:41:27 +0530
Subject: [PATCH 4/4] remove: spacing.

---
 .../database-[database]/table-[table]/layout/sidesheet.svelte   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/sidesheet.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/sidesheet.svelte
index 028d5cd18..0eb239ecc 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/sidesheet.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/layout/sidesheet.svelte
@@ -77,7 +77,7 @@
             </Layout.Stack>
         </div>
 
-        <Layout.Stack direction="column" justifyContent="space-evenly" gap="xxxl">
+        <Layout.Stack direction="column" justifyContent="space-evenly">
             <Form
                 bind:this={form}
                 bind:isSubmitting={submitting}