lunanting/ai-chatbot
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(canvas): make compare toggle unobstructed and keep consistent icon
Some checks failed
Lint / build (20) (push) Has been cancelled
Details
Playwright Tests / test (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Your Name 2026-03-01 02:17:25 +08:00
parent 7c69ccefc2
commit db1e6138e4
1 changed files with 20 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
components/canvas/nodes/ImageNode.tsx
View File

@ -1716,7 +1716,12 @@ export function ImageNode({ node, isSelected }: ImageNodeProps) {
{isSelected && !isMultiSelected && hasCompareSource && !isThisNodePicking && (
<button
type="button"
className="absolute bottom-2 right-2 z-[140] inline-flex h-8 w-8 items-center justify-center rounded-full border border-white/70 bg-black/70 text-white transition-colors hover:bg-black/80"
className={cn(
"absolute right-2 top-1/2 z-[180] inline-flex h-10 w-10 -translate-y-1/2 items-center justify-center rounded-full border text-white transition-colors",
isCompareMode
? "border-sky-200 bg-sky-500/90 shadow-[0_0_0_2px_rgba(255,255,255,0.55)]"
: "border-white/75 bg-black/75 hover:bg-black/85"
)}
onPointerDown={(event) => {
event.stopPropagation();
}}
@ -1724,25 +1729,21 @@ export function ImageNode({ node, isSelected }: ImageNodeProps) {
event.stopPropagation();
setIsCompareMode((prev) => !prev);
}}
title={isCompareMode ? "退出对比" : "开启对比"}
aria-label={isCompareMode ? "退出对比" : "开启对比"}
title={isCompareMode ? "对比已开启" : "开启对比"}
aria-label={isCompareMode ? "对比已开启" : "开启对比"}
>
{isCompareMode ? (
<X className="h-4 w-4" />
) : (
<svg
viewBox="0 0 24 24"
className="h-4 w-4"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
>
<rect x="3" y="5" width="18" height="14" rx="2" />
<path d="M12 5v14" />
</svg>
)}
<svg
viewBox="0 0 24 24"
className="h-5 w-5"
fill="none"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
>
<rect x="3" y="5" width="18" height="14" rx="2" />
<path d="M12 5v14" />
</svg>
</button>
)}
</div>