fix: align detail scale adjust buttons
This commit is contained in:
parent
d34e6c8344
commit
47c7da3a1f
@ -1483,10 +1483,13 @@ function DetailResultLocalEditDialog({
|
||||
{DETAIL_SCALE_ADJUST_OPTIONS.map((option) => {
|
||||
const active = selectedScalePercent === option;
|
||||
const Icon = option > 0 ? Maximize2 : Minimize2;
|
||||
const labelAction = option > 0 ? "放大" : "缩小";
|
||||
const labelValue = `${Math.abs(option)}%`;
|
||||
return (
|
||||
<button
|
||||
aria-label={getDetailScaleAdjustLabel(option)}
|
||||
className={cn(
|
||||
"inline-flex h-10 items-center justify-center gap-1.5 rounded-full border text-xs font-semibold transition disabled:cursor-not-allowed disabled:opacity-45",
|
||||
"grid h-12 grid-cols-[16px_minmax(0,1fr)] items-center gap-1 rounded-full border px-2 text-xs font-semibold leading-none transition disabled:cursor-not-allowed disabled:opacity-45",
|
||||
active
|
||||
? "border-emerald-300/70 bg-emerald-400/18 text-emerald-50"
|
||||
: "border-white/10 bg-black/20 text-white/68 hover:border-white/24 hover:bg-white/[0.08] hover:text-white"
|
||||
@ -1496,8 +1499,11 @@ function DetailResultLocalEditDialog({
|
||||
onClick={() => setSelectedScalePercent(option)}
|
||||
type="button"
|
||||
>
|
||||
<Icon className="h-3.5 w-3.5" />
|
||||
{getDetailScaleAdjustLabel(option)}
|
||||
<Icon className="h-3.5 w-3.5 justify-self-center" />
|
||||
<span className="flex min-w-0 flex-col items-center justify-center gap-0.5 text-center leading-[1.08]">
|
||||
<span>{labelAction}</span>
|
||||
<span>{labelValue}</span>
|
||||
</span>
|
||||
</button>
|
||||
);
|
||||
})}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user