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

style: force dark mode for image editor top navbar
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-01-18 16:34:22 +08:00
parent c5ea1ee3d6
commit 13bf0afb74
1 changed files with 15 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
components/image-annotator.tsx
View File

@ -1205,11 +1205,6 @@ export function ImageAnnotator({ imageUrl, onConfirm, onCancel, initialResizeMod
onConfirm(dataUrl);
};
// 决定显示哪个 LOGO（根据主题）
const displayLogo = resolvedTheme === "dark" && siteLogoDark
? siteLogoDark
: siteLogo;
// 弹窗内容
const modalContent = (
<div
@ -1221,24 +1216,24 @@ export function ImageAnnotator({ imageUrl, onConfirm, onCancel, initialResizeMod
className="flex flex-col overflow-hidden w-full h-full"
onClick={(e) => e.stopPropagation()}
>
{/* 顶部标题栏 */}
<div className="flex items-center justify-between border-b px-4 py-3">
{/* 顶部标题栏 - 始终深色模式 */}
<div className="flex items-center justify-between border-b border-zinc-700 px-4 py-3 bg-zinc-900 text-white">
<Link
href="/"
className="flex items-center gap-2 hover:opacity-80 transition-opacity"
onClick={(e) => e.stopPropagation()}
>
{displayLogo ? (
{siteLogoDark || siteLogo ? (
<>
<img
src={displayLogo}
src={siteLogoDark || siteLogo || undefined}
alt={siteName}
className="h-6 w-auto"
/>
<span className="text-base font-medium">{siteName}</span>
<span className="text-base font-medium text-white">{siteName}</span>
</>
) : (
<span className="text-base font-medium">{siteName}</span>
<span className="text-base font-medium text-white">{siteName}</span>
)}
</Link>
<div className="flex items-center gap-2">
@ -1248,6 +1243,7 @@ export function ImageAnnotator({ imageUrl, onConfirm, onCancel, initialResizeMod
onClick={handleRemoveBackground}
disabled={isRemovingBg || isEnhancing || isExtending || isResizeMode || showAngleEditDialog || showSceneFusion || !image}
title="移除背景（抠图）"
className="text-zinc-300 hover:text-white hover:bg-zinc-800"
>
<Scissors className={`mr-1 h-4 w-4 ${isRemovingBg ? "animate-spin" : ""}`} />
{isRemovingBg ? "处理中..." : "抠图"}
@ -1258,6 +1254,7 @@ export function ImageAnnotator({ imageUrl, onConfirm, onCancel, initialResizeMod
onClick={handleEnhance}
disabled={isEnhancing || isRemovingBg || isExtending || isResizeMode || showAngleEditDialog || showSceneFusion || !image}
title="图片变清晰"
className="text-zinc-300 hover:text-white hover:bg-zinc-800"
>
<Sparkles className={`mr-1 h-4 w-4 ${isEnhancing ? "animate-spin" : ""}`} />
{isEnhancing ? "处理中..." : "变清晰"}
@ -1268,6 +1265,7 @@ export function ImageAnnotator({ imageUrl, onConfirm, onCancel, initialResizeMod
onClick={handleExtend}
disabled={isExtending || isRemovingBg || isEnhancing || isResizeMode || showAngleEditDialog || showSceneFusion || !image}
title="图像拓展"
className="text-zinc-300 hover:text-white hover:bg-zinc-800"
>
<Expand className={`mr-1 h-4 w-4 ${isExtending ? "animate-spin" : ""}`} />
{isExtending ? "处理中..." : "图像拓展"}
@ -1277,6 +1275,7 @@ export function ImageAnnotator({ imageUrl, onConfirm, onCancel, initialResizeMod
size="sm"
onClick={handleResize}
disabled={isResizeMode || isRemovingBg || isEnhancing || isExtending || showAngleEditDialog || showSceneFusion || !image}
className="text-zinc-300 hover:text-white hover:bg-zinc-800"
title="尺寸调整"
>
<Maximize2 className="mr-1 h-4 w-4" />
@ -1288,6 +1287,7 @@ export function ImageAnnotator({ imageUrl, onConfirm, onCancel, initialResizeMod
onClick={handleAngleEdit}
disabled={showAngleEditDialog || isRemovingBg || isEnhancing || isExtending || isResizeMode || showSceneFusion || !image}
title="角度调整"
className="text-zinc-300 hover:text-white hover:bg-zinc-800"
>
<Move3D className="mr-1 h-4 w-4" />
角度调整
@ -1305,23 +1305,24 @@ export function ImageAnnotator({ imageUrl, onConfirm, onCancel, initialResizeMod
}}
disabled={showAngleEditDialog || isRemovingBg || isEnhancing || isExtending || isResizeMode}
title="场景裂变"
className={showSceneFusion ? "bg-primary text-white" : "text-zinc-300 hover:text-white hover:bg-zinc-800"}
>
<Layers className="mr-1 h-4 w-4" />
场景裂变
</Button>
{!showSceneFusion && (
<>
<Button variant="ghost" size="sm" onClick={handleUndo} disabled={actions.length === 0}>
<Button variant="ghost" size="sm" onClick={handleUndo} disabled={actions.length === 0} className="text-zinc-300 hover:text-white hover:bg-zinc-800">
<Undo className="mr-1 h-4 w-4" />
撤销
</Button>
<Button variant="ghost" size="sm" onClick={handleClear} disabled={actions.length === 0}>
<Button variant="ghost" size="sm" onClick={handleClear} disabled={actions.length === 0} className="text-zinc-300 hover:text-white hover:bg-zinc-800">
<Trash2 className="mr-1 h-4 w-4" />
清空
</Button>
</>
)}
<Button variant="ghost" size="sm" onClick={onCancel}>
<Button variant="ghost" size="sm" onClick={onCancel} className="text-zinc-300 hover:text-white hover:bg-zinc-800">
<X className="mr-1 h-4 w-4" />
取消
</Button>