style(chat): fade composer dock edge and tune plus morph timing
The composer dock backdrop was a solid block with a hard top edge, so chat text scrolling underneath got cut off abruptly. Replace it with a gradient that stays solid behind the composer and fades to transparent over the top 28px. Also set the plus to x morph to 250ms; 200ms felt too abrupt and 300ms too slow.
This commit is contained in:
parent
b24a450f26
commit
fbc5b81b54
2 changed files with 4 additions and 2 deletions
|
|
@ -342,9 +342,10 @@ const ThreadComposerDock: FC<{
|
|||
overlay ? "z-40" : "z-20",
|
||||
)}
|
||||
>
|
||||
{/* Fade the top edge so scrolled text dissolves instead of clipping. */}
|
||||
<div
|
||||
aria-hidden={true}
|
||||
className="absolute inset-x-0 bottom-0 top-[10px] bg-background"
|
||||
className="absolute inset-x-0 bottom-0 top-[10px] bg-gradient-to-t from-background from-[calc(100%_-_28px)] to-transparent"
|
||||
/>
|
||||
<div className="relative px-5 pb-2">
|
||||
<div className="pointer-events-auto mx-auto w-full max-w-(--thread-max-width)">
|
||||
|
|
|
|||
|
|
@ -1082,7 +1082,8 @@
|
|||
}
|
||||
|
||||
.unsloth-composer-plus svg {
|
||||
transition: transform var(--duration-normal) ease-in-out;
|
||||
/* 250ms reads better than --duration-normal for the plus/x morph. */
|
||||
transition: transform 250ms ease-in-out;
|
||||
transform-origin: center;
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue