From 256c1cfa4206187805cc1e2bb6012be1366049ae Mon Sep 17 00:00:00 2001
From: Arman <arman@appwrite.io>
Date: Wed, 6 Sep 2023 18:47:28 +0200
Subject: [PATCH] fix: git disconect modal design

---
 .../settings/GitDisconnectModal.svelte        | 26 +++++++------------
 1 file changed, 10 insertions(+), 16 deletions(-)

diff --git a/src/routes/console/project-[project]/settings/GitDisconnectModal.svelte b/src/routes/console/project-[project]/settings/GitDisconnectModal.svelte
index 34296e308..0e4f978a1 100644
--- a/src/routes/console/project-[project]/settings/GitDisconnectModal.svelte
+++ b/src/routes/console/project-[project]/settings/GitDisconnectModal.svelte
@@ -4,12 +4,10 @@
     import Modal from '$lib/components/modal.svelte';
     import { Dependencies } from '$lib/constants';
     import Button from '$lib/elements/forms/button.svelte';
-    import { base } from '$app/paths';
-    import { app } from '$lib/stores/app';
     import { addNotification } from '$lib/stores/notifications';
     import { sdk } from '$lib/stores/sdk';
     import { Query, type Models } from '@appwrite.io/console';
-    import { Avatar } from '$lib/components';
+    import { SvgIcon } from '$lib/components';
     import { toLocaleDateTime } from '$lib/helpers/date';
 
     export let showGitDisconnect: boolean;
@@ -68,21 +66,17 @@
         {#if functions.total}
             <div class="u-flex u-flex-vertical u-gap-12">
                 {#each functions.functions as func}
-                    <div class="u-flex u-main-space-between u-cross-center u-width-full-line">
-                        <div class="u-flex u-main-start u-cross-center u-gap-8">
-                            <Avatar
-                                size={24}
-                                name={func.runtime.split('-')[0]}
-                                src={`${base}/icons/${$app.themeInUse}/color/${
-                                    func.runtime.split('-')[0]
-                                }.svg`} />
-
+                    <div class="u-flex u-main-start u-gap-8">
+                        <div class="avatar is-size-x-small">
+                            <SvgIcon name={func.runtime.split('-')[0]} />
+                        </div>
+                        <div
+                            class="u-cross-child-center u-flex u-main-space-between u-flex-wrap u-gap-8 u-width-full-line">
                             <h6>{func.name}</h6>
+                            <p class="u-x-small" style="color: hsl(var(--color-neutral-70));">
+                                Last deployed: {toLocaleDateTime(func.$updatedAt)}
+                            </p>
                         </div>
-
-                        <p class="u-x-small" style="color: hsl(var(--color-neutral-70));">
-                            Last deployed: {toLocaleDateTime(func.$updatedAt)}
-                        </p>
                     </div>
                 {/each}
             </div>