Fix grey scroll-fade bands on macOS Safari 27 Beta (#6507)

The chat and sidebar scroll-fade overlays ended their gradient at the
`transparent` keyword, which is transparent black. Safari 27 Beta
(Liquid Glass) interpolates an opaque colour to transparent black
through a grey midtone, so the fades render as two solid grey bands
(top of the chat and above the composer).

Fade each gradient to the theme colour at zero alpha instead, so every
step keeps the same hue and no grey can appear. Fixes #6457.

Co-authored-by: wasimysaid <wasimysdev@gmail.com>
This commit is contained in:
Michael Han 2026-06-22 04:59:13 -07:00 committed by GitHub
commit 586262decd
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 10 additions and 4 deletions

View file

@ -1355,7 +1355,7 @@ export function AppSidebar() {
<div
aria-hidden="true"
className={cn(
"pointer-events-none absolute left-0 right-2 bottom-full h-10 bg-gradient-to-t from-[var(--sidebar)] to-transparent transition-opacity duration-200",
"pointer-events-none absolute left-0 right-2 bottom-full h-10 bg-gradient-to-t from-[var(--sidebar)] to-[rgb(from_var(--sidebar)_r_g_b/0)] transition-opacity duration-200",
canScrollDown ? "opacity-100" : "opacity-0",
)}
/>

View file

@ -1210,7 +1210,7 @@ const ThreadComposerDock: FC<{
<div
aria-hidden={true}
className={cn(
"absolute inset-x-0 bottom-0 bg-gradient-to-t from-background from-[calc(100%_-_28px)] to-transparent",
"absolute inset-x-0 bottom-0 bg-gradient-to-t from-background from-[calc(100%_-_28px)] to-[rgb(from_var(--background)_r_g_b/0)]",
queueVisible
? "h-32 backdrop-blur-[1px] [mask-image:linear-gradient(to_top,black_0%,black_58%,transparent_100%)]"
: "top-[10px]",