From 9b6fa89622db9a5f428e02986d37abb52e57e0ce Mon Sep 17 00:00:00 2001
From: Danny Avila <danny@librechat.ai>
Date: Tue, 1 Apr 2025 04:07:01 -0400
Subject: [PATCH] =?UTF-8?q?=F0=9F=8E=A8=20style:=20Fix=20Footer=20Centerin?=
 =?UTF-8?q?g?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/components/Chat/ChatView.tsx | 16 +++++-----
 client/src/components/Chat/Footer.tsx   | 41 ++++++++++++++-----------
 2 files changed, 32 insertions(+), 25 deletions(-)

diff --git a/client/src/components/Chat/ChatView.tsx b/client/src/components/Chat/ChatView.tsx
index 1fbfdef736..30b1510e88 100644
--- a/client/src/components/Chat/ChatView.tsx
+++ b/client/src/components/Chat/ChatView.tsx
@@ -71,14 +71,16 @@ function ChatView({ index = 0 }: { index?: number }) {
               {!isLoading && <Header />}
 
               {isLandingPage ? (
-                <div className="flex flex-1 flex-col items-center justify-end sm:justify-center">
-                  {content}
-                  <div className="w-full max-w-3xl transition-all duration-200 xl:max-w-4xl">
-                    <ChatForm index={index} />
-                    <ConversationStarters />
-                    <Footer />
+                <>
+                  <div className="flex flex-1 flex-col items-center justify-end sm:justify-center">
+                    {content}
+                    <div className="w-full max-w-3xl transition-all duration-200 xl:max-w-4xl">
+                      <ChatForm index={index} />
+                      <ConversationStarters />
+                    </div>
                   </div>
-                </div>
+                  <Footer />
+                </>
               ) : (
                 <div className="flex h-full flex-col overflow-y-auto">
                   {content}
diff --git a/client/src/components/Chat/Footer.tsx b/client/src/components/Chat/Footer.tsx
index b2d7b12270..babf9ff028 100644
--- a/client/src/components/Chat/Footer.tsx
+++ b/client/src/components/Chat/Footer.tsx
@@ -83,24 +83,29 @@ export default function Footer({ className }: { className?: string }) {
   );
 
   return (
-    <div
-      className={
-        className ??
-        'absolute bottom-0 left-0 right-0 hidden items-center justify-center gap-2 px-2 py-2 text-center text-xs text-text-primary sm:flex md:px-[60px]'
-      }
-      role="contentinfo"
-    >
-      {footerElements.map((contentRender, index) => {
-        const isLastElement = index === footerElements.length - 1;
-        return (
-          <React.Fragment key={`footer-element-${index}`}>
-            {contentRender}
-            {!isLastElement && (
-              <div key={`separator-${index}`} className="h-2 border-r-[1px] border-border-medium" />
-            )}
-          </React.Fragment>
-        );
-      })}
+    <div className="relative w-full">
+      <div
+        className={
+          className ??
+          'absolute bottom-0 left-0 right-0 hidden items-center justify-center gap-2 px-2 py-2 text-center text-xs text-text-primary sm:flex md:px-[60px]'
+        }
+        role="contentinfo"
+      >
+        {footerElements.map((contentRender, index) => {
+          const isLastElement = index === footerElements.length - 1;
+          return (
+            <React.Fragment key={`footer-element-${index}`}>
+              {contentRender}
+              {!isLastElement && (
+                <div
+                  key={`separator-${index}`}
+                  className="h-2 border-r-[1px] border-border-medium"
+                />
+              )}
+            </React.Fragment>
+          );
+        })}
+      </div>
     </div>
   );
 }