mirror of
https://github.com/danny-avila/LibreChat.git
synced 2025-12-18 09:20:15 +01:00
🎨 style: Fix Footer Centering
This commit is contained in:
parent
90b8769ef3
commit
9b6fa89622
2 changed files with 32 additions and 25 deletions
|
|
@ -71,14 +71,16 @@ function ChatView({ index = 0 }: { index?: number }) {
|
||||||
{!isLoading && <Header />}
|
{!isLoading && <Header />}
|
||||||
|
|
||||||
{isLandingPage ? (
|
{isLandingPage ? (
|
||||||
<div className="flex flex-1 flex-col items-center justify-end sm:justify-center">
|
<>
|
||||||
{content}
|
<div className="flex flex-1 flex-col items-center justify-end sm:justify-center">
|
||||||
<div className="w-full max-w-3xl transition-all duration-200 xl:max-w-4xl">
|
{content}
|
||||||
<ChatForm index={index} />
|
<div className="w-full max-w-3xl transition-all duration-200 xl:max-w-4xl">
|
||||||
<ConversationStarters />
|
<ChatForm index={index} />
|
||||||
<Footer />
|
<ConversationStarters />
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<Footer />
|
||||||
|
</>
|
||||||
) : (
|
) : (
|
||||||
<div className="flex h-full flex-col overflow-y-auto">
|
<div className="flex h-full flex-col overflow-y-auto">
|
||||||
{content}
|
{content}
|
||||||
|
|
|
||||||
|
|
@ -83,24 +83,29 @@ export default function Footer({ className }: { className?: string }) {
|
||||||
);
|
);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div className="relative w-full">
|
||||||
className={
|
<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]'
|
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"
|
}
|
||||||
>
|
role="contentinfo"
|
||||||
{footerElements.map((contentRender, index) => {
|
>
|
||||||
const isLastElement = index === footerElements.length - 1;
|
{footerElements.map((contentRender, index) => {
|
||||||
return (
|
const isLastElement = index === footerElements.length - 1;
|
||||||
<React.Fragment key={`footer-element-${index}`}>
|
return (
|
||||||
{contentRender}
|
<React.Fragment key={`footer-element-${index}`}>
|
||||||
{!isLastElement && (
|
{contentRender}
|
||||||
<div key={`separator-${index}`} className="h-2 border-r-[1px] border-border-medium" />
|
{!isLastElement && (
|
||||||
)}
|
<div
|
||||||
</React.Fragment>
|
key={`separator-${index}`}
|
||||||
);
|
className="h-2 border-r-[1px] border-border-medium"
|
||||||
})}
|
/>
|
||||||
|
)}
|
||||||
|
</React.Fragment>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue