From 50bf55cfef1d58dc30e86af7e89802ba26448f7d Mon Sep 17 00:00:00 2001
From: ruru <142723369+ruru-m07@users.noreply.github.com>
Date: Thu, 16 May 2024 16:08:02 +0530
Subject: [PATCH] fix(ui): resolve UI issues

---
 app/page.tsx                  | 10 +++++++---
 components/listSuggestion.tsx |  2 +-
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/app/page.tsx b/app/page.tsx
index 2e95c38..e43a363 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -98,7 +98,7 @@ export default function Home() {
         <div className=" flex h-screen mx-0 lg:mx-48 xl:mx-60 flex-col p-4 lg:col-span-2">
           <div className="w-full h-5/6 mb-2 flex  items-end">
             <Card className="h-full w-full py-4 flex justify-center items-center bg-primary-foreground/25">
-              <ScrollArea className=" flex justify-center items-center">
+              <ScrollArea className=" flex justify-center items-center w-full">
                 {error ? (
                   <div>
                     <h3 className="scroll-m-20 text-2xl font-semibold tracking-tight">
@@ -108,14 +108,18 @@ export default function Home() {
                     <p className="text-sm text-muted-foreground">{error}</p>
                   </div>
                 ) : isLoading ? (
-                  <Loader />
+                  <div className="w-full flex items-center justify-center">
+                    <Loader />
+                  </div>
                 ) : commitMessages ? (
                   <ListSuggestion
                     suggestions={commitMessages!}
                     commitChanges={commitChanges || ""}
                   />
                 ) : (
-                  <EmptyScreen onSubmit={handelSubmit} />
+                  <div className="w-full flex items-center justify-center">
+                    <EmptyScreen onSubmit={handelSubmit} />
+                  </div>
                 )}
               </ScrollArea>
             </Card>
diff --git a/components/listSuggestion.tsx b/components/listSuggestion.tsx
index cb9b186..61fd26a 100644
--- a/components/listSuggestion.tsx
+++ b/components/listSuggestion.tsx
@@ -9,7 +9,7 @@ const ListSuggestion = ({
   commitChanges: string;
 }) => {
   return (
-    <div className="w-fit mx-4 md:mx-10">
+    <div className="mx-4 md:mx-10">
       <h1 className="text-xl font-bold">{commitChanges}</h1>
       <MarkdownReader markdown={suggestions} />
     </div>