Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2025-12-18 17:30:16 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

🔧 style: Improve UI and UX with Style Fixes and Code Refactors (#2002)

Browse source 
* refactor(useSSE): add useCallback to all event handlers

* chore: remove modelName in defaultAssistantFormValues

* fix(SidePanel): fix layout shift on chrome my removing sidenav scrollbar

* style(ChatForm): match ChatGPT textarea effect styling

* style: fix flickering of old background color on refresh
This commit is contained in:
Danny Avila 2024-03-06 17:49:53 -05:00 • committed by GitHub
parent b2ab6fd19d
commit ab66747e97
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
7 changed files with 412 additions and 375 deletions
Download patch file Download diff file Expand all files Collapse all files

2
client/src/components/Chat/Input/ChatForm.tsx
View file

@ -43,7 +43,7 @@ export default function ChatForm({ index = 0 }) {
>
<div className="relative flex h-full flex-1 items-stretch md:flex-col">
<div className="flex w-full items-center">
<div className="[&:has(textarea:focus)]:border-token-border-xheavy border-token-border-heavy shadow-xs dark:shadow-xs relative flex w-full flex-grow flex-col overflow-hidden rounded-2xl border border-black/10 bg-white shadow-[0_0_0_2px_rgba(255,255,255,0.95)] dark:border-gray-600 dark:bg-gray-800 dark:text-white dark:shadow-[0_0_0_2px_rgba(33,33,33,1)] [&:has(textarea:focus)]:shadow-[0_2px_6px_rgba(0,0,0,0.3)]">
<div className="[&:has(textarea:focus)]:border-token-border-xheavy dark:border-token-border-medium border-token-border-medium bg-token-main-surface-primary relative flex w-full flex-grow flex-col overflow-hidden rounded-2xl border dark:text-white [&:has(textarea:focus)]:shadow-[0_2px_6px_rgba(0,0,0,.05)]">
<FileRow
files={files}
setFiles={setFiles}

2
client/src/components/SidePanel/Nav.tsx
View file

@ -20,7 +20,7 @@ export default function Nav({ links, isCollapsed, resize, defaultActive }: NavPr
return (
<div
data-collapsed={isCollapsed}
className="bg-token-sidebar-surface-primary group flex-shrink-0 overflow-x-hidden py-2 data-[collapsed=true]:py-2"
className="bg-token-sidebar-surface-primary hide-scrollbar group flex-shrink-0 overflow-x-hidden py-2 data-[collapsed=true]:py-2"
>
<div className="h-full">
<div className="flex h-full min-h-0 flex-col">

2
client/src/components/SidePanel/SidePanel.tsx
View file

@ -172,7 +172,7 @@ export default function SidePanel({
localStorage.setItem('react-resizable-panels:collapsed', 'true');
}}
className={cn(
'sidenav border-l border-gray-200 bg-white dark:border-gray-800/50 dark:bg-gray-900',
'sidenav hide-scrollbar border-l border-gray-200 bg-white dark:border-gray-800/50 dark:bg-gray-900',
isCollapsed ? 'min-w-[50px]' : 'min-w-[340px] sm:min-w-[352px]',
minSize === 0 ? 'min-w-0' : '',
)}