Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2026-01-23 10:46:12 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

😶‍🌫 feat: Better Blur on Collapsed Chat Input (#11464)

Browse source
This commit is contained in:
Dustin Healy 2026-01-21 10:54:20 -08:00 • committed by GitHub
parent 9d612715a5
commit dea246934e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 11 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -258,7 +258,17 @@ const ChatForm = memo(({ index = 0 }: { index?: number }) => {
<FileFormChat conversation={conversation} />
{endpoint && (
<div className={cn('flex', isRTL ? 'flex-row-reverse' : 'flex-row')}>
<div className="relative flex-1">
<div
className="relative flex-1"
style={
isCollapsed
? {
WebkitMaskImage: 'linear-gradient(to bottom, black 60%, transparent 90%)',
maskImage: 'linear-gradient(to bottom, black 60%, transparent 90%)',
}
: undefined
}
>
<TextareaAutosize
{...registerProps}
ref={(e) => {
@ -290,16 +300,6 @@ const ChatForm = memo(({ index = 0 }: { index?: number }) => {
'scrollbar-hover transition-[max-height] duration-200 disabled:cursor-not-allowed',
)}
/>
{isCollapsed && (
<div
className="pointer-events-none absolute bottom-0 left-0 right-0 h-10 transition-all duration-200"
style={{
backdropFilter: 'blur(2px)',
WebkitMaskImage: 'linear-gradient(to top, black 15%, transparent 75%)',
maskImage: 'linear-gradient(to top, black 15%, transparent 75%)',
}}
/>
)}
</div>
<div className="flex flex-col items-start justify-start pr-2.5 pt-1.5">
<CollapseChat