fix: move psd text helper badges out of content
Some checks failed
Lint / build (20) (push) Has been cancelled
Playwright Tests / test (push) Has been cancelled

This commit is contained in:
Your Name 2026-03-31 18:18:23 +08:00
parent 14cd997a43
commit cc01b539bc

View File

@ -202,12 +202,22 @@ function getInlineTextEditorStyle(
return {
...baseStyle,
background: "transparent",
boxSizing: "border-box",
overflow: "hidden",
color: preserveSourceAppearance ? "transparent" : layer.textColor,
caretColor: 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({
open,
onOpenChange,
@ -742,7 +752,7 @@ export function AgentPsdTemplateEditorDialog({
return (
<div
key={layer.id}
className="absolute overflow-hidden rounded-lg"
className="absolute overflow-visible rounded-lg"
style={{
...frameStyle,
zIndex: 40,
@ -770,7 +780,7 @@ export function AgentPsdTemplateEditorDialog({
className="h-full w-full resize-none border-none bg-transparent outline-none"
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}
</div>
</div>
@ -783,7 +793,7 @@ export function AgentPsdTemplateEditorDialog({
type="button"
onClick={() => setSelectedLayerId(layer.id)}
onDoubleClick={() => setSelectedLayerId(layer.id)}
className="absolute overflow-hidden rounded-lg transition-all"
className="absolute overflow-visible rounded-lg transition-all"
style={{
...frameStyle,
zIndex: isSelected ? 40 : 30,
@ -792,11 +802,11 @@ export function AgentPsdTemplateEditorDialog({
aria-label={`${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}
</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>
</button>