From a024793a6a28e64145dc0876f8328b38a3a07e2f Mon Sep 17 00:00:00 2001
From: zl7261 <zhenliu7261@gmail.com>
Date: Fri, 26 Sep 2025 03:57:42 +0000
Subject: [PATCH] Web UI - center the loading icon

---
 lightrag_webui/src/App.tsx                  | 2 +-
 lightrag_webui/src/features/GraphViewer.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/lightrag_webui/src/App.tsx b/lightrag_webui/src/App.tsx
index e2228359..b8ae023d 100644
--- a/lightrag_webui/src/App.tsx
+++ b/lightrag_webui/src/App.tsx
@@ -189,7 +189,7 @@ function App() {
             {/* Loading indicator in content area */}
             <div className="flex flex-1 items-center justify-center">
               <div className="text-center">
-                <div className="mb-2 h-8 w-8 animate-spin rounded-full border-4 border-primary border-t-transparent"></div>
+                <div className="mb-2 h-8 w-8 animate-spin rounded-full border-4 border-primary border-t-transparent mx-auto"></div>
                 <p>Initializing...</p>
               </div>
             </div>
diff --git a/lightrag_webui/src/features/GraphViewer.tsx b/lightrag_webui/src/features/GraphViewer.tsx
index 5649f1e7..ec7678d9 100644
--- a/lightrag_webui/src/features/GraphViewer.tsx
+++ b/lightrag_webui/src/features/GraphViewer.tsx
@@ -248,7 +248,7 @@ const GraphViewer = () => {
       {(isFetching || isThemeSwitching) && (
         <div className="absolute inset-0 flex items-center justify-center bg-background/80 z-10">
           <div className="text-center">
-            <div className="mb-2 h-8 w-8 animate-spin rounded-full border-4 border-primary border-t-transparent"></div>
+            <div className="mb-2 h-8 w-8 animate-spin rounded-full border-4 border-primary border-t-transparent mx-auto"></div>
             <p>{isThemeSwitching ? 'Switching Theme...' : 'Loading Graph Data...'}</p>
           </div>
         </div>