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

fix: move psd text helper badges out of content
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-31 18:18:23 +08:00
parent 14cd997a43
commit cc01b539bc
1 changed files with 15 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
components/agents/AgentPsdTemplateEditorDialog.tsx
View File

@ -202,12 +202,22 @@ function getInlineTextEditorStyle(
return { return {
...baseStyle, ...baseStyle,
background: "transparent", background: "transparent",
boxSizing: "border-box",
overflow: "hidden",
color: preserveSourceAppearance ? "transparent" : layer.textColor, color: preserveSourceAppearance ? "transparent" : layer.textColor,
caretColor: layer.textColor, caretColor: layer.textColor,
WebkitTextFillColor: preserveSourceAppearance ? "transparent" : layer.textColor, WebkitTextFillColor: preserveSourceAppearance ? "transparent" : layer.textColor,
}; };
} }
function getTextLayerNameBadgeClassName() {
return "pointer-events-none absolute left-0 top-0 -translate-y-[calc(100%+6px)] rounded-full bg-black/78 px-2 py-1 text-[11px] whitespace-nowrap text-white shadow-lg";
}
function getTextLayerHintBadgeClassName() {
return "pointer-events-none absolute right-0 top-0 -translate-y-[calc(100%+6px)] rounded-full bg-sky-500/90 px-2 py-1 text-[11px] whitespace-nowrap text-white shadow-lg";
}
export function AgentPsdTemplateEditorDialog({ export function AgentPsdTemplateEditorDialog({
open, open,
onOpenChange, onOpenChange,
@ -742,7 +752,7 @@ export function AgentPsdTemplateEditorDialog({
return ( return (
<div <div
key={layer.id} key={layer.id}
className="absolute overflow-hidden rounded-lg" className="absolute overflow-visible rounded-lg"
style={{ style={{
...frameStyle, ...frameStyle,
zIndex: 40, zIndex: 40,
@ -770,7 +780,7 @@ export function AgentPsdTemplateEditorDialog({
className="h-full w-full resize-none border-none bg-transparent outline-none" className="h-full w-full resize-none border-none bg-transparent outline-none"
style={getInlineTextEditorStyle(layer, preserveSourceAppearance, currentValue)} style={getInlineTextEditorStyle(layer, preserveSourceAppearance, currentValue)}
/> />
<div className="absolute left-2 top-2 rounded-full bg-black/70 px-2 py-1 text-[11px] text-white"> <div className={getTextLayerNameBadgeClassName()}>
{layer.layerName} {layer.layerName}
</div> </div>
</div> </div>
@ -783,7 +793,7 @@ export function AgentPsdTemplateEditorDialog({
type="button" type="button"
onClick={() => setSelectedLayerId(layer.id)} onClick={() => setSelectedLayerId(layer.id)}
onDoubleClick={() => setSelectedLayerId(layer.id)} onDoubleClick={() => setSelectedLayerId(layer.id)}
className="absolute overflow-hidden rounded-lg transition-all" className="absolute overflow-visible rounded-lg transition-all"
style={{ style={{
...frameStyle, ...frameStyle,
zIndex: isSelected ? 40 : 30, zIndex: isSelected ? 40 : 30,
@ -792,11 +802,11 @@ export function AgentPsdTemplateEditorDialog({
aria-label={`${getLayerLabel(layer)} ${layer.layerName}`} aria-label={`${getLayerLabel(layer)} ${layer.layerName}`}
title={`${getLayerLabel(layer)}：${layer.layerName}`} title={`${getLayerLabel(layer)}：${layer.layerName}`}
> >
<div className="absolute left-2 top-2 rounded-full bg-black/70 px-2 py-1 text-[11px] text-white"> <div className={getTextLayerNameBadgeClassName()}>
{layer.layerName} {layer.layerName}
</div> </div>
<div className="pointer-events-none absolute bottom-2 right-2 rounded-full bg-sky-500/85 px-2 py-1 text-[11px] text-white"> <div className={getTextLayerHintBadgeClassName()}>
点击编辑文字 点击编辑文字
</div> </div>
</button> </button>