ext/hyperframes
2
0
Fork 0
mirror of https://github.com/heygen-com/hyperframes.git synced 2026-09-03 04:38:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #2533 from heygen-com/fix/studio-promotable-badge-overlap

Browse Source 
fix(studio): reserve a gutter for the promote-to-variable badge
This commit is contained in:
Vance Ingalls
2026-07-16 02:06:28 -07:00
committed by GitHub
parent 1a2e7524e2 14dbfca5a7
commit eb967f1542
2 changed files with 6 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/studio/src/components/editor/PromotableControl.tsx
+4 -2
View File
@@ -81,7 +81,9 @@ export function PromotableControl({
{rendered}
{bound && (
<span
className="pointer-events-none absolute right-1.5 top-0 z-10 inline-flex max-w-[60%] items-center gap-1 truncate rounded bg-studio-accent/20 px-1 py-px font-mono text-[8px] font-medium text-studio-accent"
// Sits above the row (not on top of top-0) so it clears a value that
// renders flush to the row's right edge, e.g. flat Font/Color rows.
className="pointer-events-none absolute -top-2 right-1.5 z-10 inline-flex max-w-[60%] items-center gap-1 truncate rounded bg-studio-accent/20 px-1 py-px font-mono text-[8px] font-medium text-studio-accent"
title={`Bound to variable "${promote.boundId}"`}
>
◆ {promote.boundId}
@@ -95,7 +97,7 @@ export function PromotableControl({
e.stopPropagation();
promote.promote();
}}
className="absolute right-1.5 top-0 z-10 inline-flex items-center gap-1 rounded bg-neutral-800/80 px-1 py-px font-mono text-[8px] font-medium text-neutral-400 opacity-70 transition-colors hover:bg-studio-accent/20 hover:text-studio-accent hover:opacity-100"
className="absolute -top-2 right-1.5 z-10 inline-flex items-center gap-1 rounded bg-neutral-800/80 px-1 py-px font-mono text-[8px] font-medium text-neutral-400 opacity-70 transition-colors hover:bg-studio-accent/20 hover:text-studio-accent hover:opacity-100"
>
◇ var
</button>
packages/studio/src/components/editor/propertyPanelFlatTextSection.tsx
+2 -2
View File
@@ -267,7 +267,7 @@ export function FlatTextSection({
if (textFields.length > 1) {
return (
<div className="space-y-1.5">
<div className="space-y-2.5">
<FlatTextLayerList
fields={textFields}
activeFieldKey={activeField.key}
@@ -295,7 +295,7 @@ export function FlatTextSection({
}
return (
<div className="space-y-1.5">
<div className="space-y-2.5">
<FlatTextFieldEditor
field={activeField}
styles={styles}