mirrors/hermes-agent
1
0
Fork 0
mirror of https://github.com/NousResearch/hermes-agent.git synced 2026-07-31 19:16:29 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

fix(desktop): anchor the inline image download button to the image, not the block

Browse source 
The <img> carried max-w-[min(100%,var(--image-preview-max-width))] while its
container was w-fit max-w-full. A percentage max-width resolves to none while
the container measures its fit-content width, so the container took the full
column while the image stayed capped — and the absolutely positioned download
button, which anchors to the container, drifted into the margin on any image
wider than it is tall.

Move the width cap onto the container and leave the image at max-w-full. The
container now shrink-wraps the rendered image, so right-2/top-2 lands on the
image's own corner at every aspect ratio.
This commit is contained in:
Brooklyn Nicholson 2026-07-27 21:51:27 -05:00
parent 84858d76ba
commit 2e61feb94e
1 changed files with 6 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

8
apps/desktop/src/components/assistant-ui/markdown-text.tsx
View file

@ -373,14 +373,18 @@ function MarkdownImage({ className, src, alt, ...props }: ComponentProps<'img'>)
return <span className="my-2 block text-sm text-muted-foreground">Loading {name}...</span>
}
// The width cap belongs on the container, not the <img>: a percentage
// max-width resolves to none while the container measures its fit-content
// width, so the box overshoots the rendered image and strands the download
// button — which anchors to the container — out in the margin.
return (
<ZoomableImage
alt={alt}
className={cn(
'm-0 block h-auto w-auto max-h-(--image-preview-height) max-w-[min(100%,var(--image-preview-max-width))] rounded-lg object-contain shadow-[0_0.0625rem_0.125rem_color-mix(in_srgb,#000_4%,transparent),0_0.625rem_1.5rem_color-mix(in_srgb,#000_5%,transparent)]',
'm-0 block h-auto w-auto max-h-(--image-preview-height) max-w-full rounded-lg object-contain shadow-[0_0.0625rem_0.125rem_color-mix(in_srgb,#000_4%,transparent),0_0.625rem_1.5rem_color-mix(in_srgb,#000_5%,transparent)]',
className
)}
containerClassName="my-2 block w-fit max-w-full"
containerClassName="my-2 block w-fit max-w-[min(100%,var(--image-preview-max-width))]"
slot="aui_markdown-image"
src={resolvedSrc}
{...props}