From faf49c7373edc43b08029c4f657bd90c7d951eaa Mon Sep 17 00:00:00 2001
From: Arman <arman@appwrite.io>
Date: Mon, 30 May 2022 14:52:24 +0200
Subject: [PATCH] feat: small changes to layout

---
 .../console/[project]/users/index.svelte      | 50 ++++++++++++-------
 1 file changed, 32 insertions(+), 18 deletions(-)

diff --git a/src/routes/console/[project]/users/index.svelte b/src/routes/console/[project]/users/index.svelte
index fdf826c34..d9a19b521 100644
--- a/src/routes/console/[project]/users/index.svelte
+++ b/src/routes/console/[project]/users/index.svelte
@@ -55,7 +55,11 @@
 <Container>
     <div class="u-flex u-gap-12 common-section u-main-space-between">
         <div class="input-text-wrapper u-stretch" style="max-width: 500px">
-            <input type="search" class="input-text" bind:value={search} />
+            <input
+                type="search"
+                placeholder="Search Name, Email, or ID"
+                class="input-text"
+                bind:value={search} />
             <span class="icon-search" aria-hidden="true" />
         </div>
 
@@ -117,30 +121,40 @@
         </div>
     {:else if search}
         <Empty>
-            <div class="common-section">
+            <div class="u-flex">
                 <b>Sorry, we couldn’t find ‘{search}’</b>
-            </div>
-            <div class="common-section">
-                <p>There are no users that match your search.</p>
-            </div>
-            <div class="common-section">
-                <Button secondary on:click={() => (search = '')}>Clear Search</Button>
+                <div class="common-section">
+                    <p>There are no users that match your search.</p>
+                </div>
+                <div class="common-section">
+                    <Button secondary on:click={() => (search = '')}>Clear Search</Button>
+                </div>
             </div>
         </Empty>
+        <div class="u-flex common-section u-main-space-between">
+            <p class="text">Total results: {$usersList.response.total}</p>
+            <Pagination {limit} bind:offset sum={$usersList.response.total} />
+        </div>
     {:else}
         <Empty dashed centered>
-            <div class="common-section">
-                <Button secondary round on:click={() => (showCreate = true)}>
-                    <i class="icon-plus" />
-                </Button>
-            </div>
-            <div class="common-section">
-                <p>Add Your First User To Get Started</p>
-            </div>
-            <div class="common-section">
-                <Button secondary href="#">Documentation</Button>
+            <div class="u-flex">
+                <div class="common-section">
+                    <Button secondary round on:click={() => (showCreate = true)}>
+                        <i class="icon-plus" />
+                    </Button>
+                </div>
+                <div class="common-section">
+                    <p>Add Your First User To Get Started</p>
+                </div>
+                <div class="common-section">
+                    <Button secondary href="#">Documentation</Button>
+                </div>
             </div>
         </Empty>
+        <div class="u-flex common-section u-main-space-between">
+            <p class="text">Total results: {$usersList.response.total}</p>
+            <Pagination {limit} bind:offset sum={$usersList.response.total} />
+        </div>
     {/if}
 </Container>