mirror/nanobot
1
0
Fork 0
mirror of https://github.com/HKUDS/nanobot.git synced 2026-08-09 13:58:36 +03:00
Code Issues Packages Projects Releases Wiki Activity

fix(webui): prevent image hover clipping (#5294)

Browse Source
This commit is contained in:
chengyongru
2026-08-08 18:05:00 +08:00
committed by GitHub
parent bd8d3ad5b6
commit 4e063f5695
2 changed files with 9 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
webui/src/components/MessageBubble.tsx
+1 -2
View File
@@ -724,8 +724,7 @@ function UserImageCell({
aria-label={image.name ? `${openLabel}: ${image.name}` : openLabel} aria-label={image.name ? `${openLabel}: ${image.name}` : openLabel}
className={cn( className={cn(
tileClasses, tileClasses,
"block cursor-zoom-in p-0 transition-transform duration-150 motion-reduce:transition-none", "block cursor-zoom-in p-0",
"hover:scale-[1.01] hover:ring-2 hover:ring-primary/25",
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/50", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/50",
)} )}
> >
webui/src/tests/message-bubble.test.tsx
+8
View File
@@ -916,6 +916,14 @@ describe("MessageBubble", () => {
const imageButton = screen.getByRole("button", { name: /view image/i }); const imageButton = screen.getByRole("button", { name: /view image/i });
expect(imageButton).toHaveClass("w-[min(100%,34rem)]", "rounded-[20px]"); expect(imageButton).toHaveClass("w-[min(100%,34rem)]", "rounded-[20px]");
expect(imageButton).toHaveClass(
"border",
"border-border/60",
"focus-visible:ring-2",
);
expect(imageButton).not.toHaveClass("hover:scale-[1.01]");
expect(imageButton).not.toHaveClass("hover:ring-2");
expect(imageButton).not.toHaveClass("hover:ring-primary/25");
expect(imageButton).not.toHaveAttribute("title"); expect(imageButton).not.toHaveAttribute("title");
expect(container.querySelector("img")).toHaveClass("h-auto", "w-full", "object-contain"); expect(container.querySelector("img")).toHaveClass("h-auto", "w-full", "object-contain");
}); });