Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2025-12-21 10:50:14 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

🎨 style: Improve Styling (#3205)

Browse source 
* style: add scrollbar-gutter to prevent layout shift

* style: better styling for simple/advanced tab and remove border-r on smaller screens

* style: better description styling

* style: make sure single response Messages style is the same as pre-multi-stream response feature
This commit is contained in:
Danny Avila 2024-06-25 14:28:05 -04:00 • committed by GitHub
parent 156c52e293
commit 791b0139bc
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
9 changed files with 44 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

11
client/src/components/Chat/Messages/Message.tsx
View file

@ -27,7 +27,10 @@ const MessageContainer = React.memo(
);
const PlaceholderRow = React.memo(({ isLast, isCard }: { isLast: boolean; isCard?: boolean }) => {
if (!isLast && !isCard) {
if (!isCard) {
return null;
}
if (!isLast) {
return null;
}
return <div className="mt-1 h-[27px] bg-transparent" />;
@ -99,7 +102,7 @@ const MessageRender = React.memo(
'final-completion group mx-auto flex flex-1 gap-3 text-base',
isCard
? 'relative w-full gap-1 rounded-lg border border-border-medium bg-surface-primary-alt p-2 md:w-1/2 md:gap-3 md:p-4'
: '',
: 'md:max-w-3xl lg:max-w-[40rem] xl:max-w-[48rem]',
isLatest ? 'bg-surface-secondary' : '',
isLast && !isSubmittingFamily && isCard
? 'cursor-pointer transition-colors duration-300'
@ -212,9 +215,7 @@ export default function Message(props: TMessageProps) {
</div>
) : (
<div className="m-auto justify-center p-4 py-2 text-base md:gap-6 ">
<div className="final-completion group mx-auto flex flex-1 gap-3 text-base md:max-w-3xl md:px-5 lg:max-w-[40rem] lg:px-1 xl:max-w-[48rem] xl:px-5">
<MessageRender {...props} />
</div>
<MessageRender {...props} />
</div>
)}
</MessageContainer>