diff --git a/src/components/editor/TextSettings.vue b/src/components/editor/TextSettings.vue index 92d77f5..d8768ba 100644 --- a/src/components/editor/TextSettings.vue +++ b/src/components/editor/TextSettings.vue @@ -87,6 +87,7 @@
{ if (margins) { if (margins.simple) { marginOuter.value = margins.simple; + // Sync detailed from simple + marginOuterDetailed.value = { + top: { ...margins.simple }, + right: { ...margins.simple }, + bottom: { ...margins.simple }, + left: { ...margins.simple } + }; } else if (margins.detailed) { marginOuterDetailed.value = margins.detailed; + // Check if all values are the same to set simple value + const allSame = + margins.detailed.top.value === margins.detailed.right.value && + margins.detailed.top.value === margins.detailed.bottom.value && + margins.detailed.top.value === margins.detailed.left.value && + margins.detailed.top.unit === margins.detailed.right.unit && + margins.detailed.top.unit === margins.detailed.bottom.unit && + margins.detailed.top.unit === margins.detailed.left.unit; + + if (allSame) { + marginOuter.value = margins.detailed.top; + } else { + // Values are different, open the detailed editor and use first value for simple + marginOuter.value = margins.detailed.top; + // Open detailed view after mount + setTimeout(() => { + if (marginOuterEditor.value) { + marginOuterEditor.value.expanded = true; + } + }, 0); + } } } @@ -247,8 +280,36 @@ const syncFromStore = () => { if (padding) { if (padding.simple) { marginInner.value = padding.simple; + // Sync detailed from simple + marginInnerDetailed.value = { + top: { ...padding.simple }, + right: { ...padding.simple }, + bottom: { ...padding.simple }, + left: { ...padding.simple } + }; } else if (padding.detailed) { marginInnerDetailed.value = padding.detailed; + // Check if all values are the same to set simple value + const allSame = + padding.detailed.top.value === padding.detailed.right.value && + padding.detailed.top.value === padding.detailed.bottom.value && + padding.detailed.top.value === padding.detailed.left.value && + padding.detailed.top.unit === padding.detailed.right.unit && + padding.detailed.top.unit === padding.detailed.bottom.unit && + padding.detailed.top.unit === padding.detailed.left.unit; + + if (allSame) { + marginInner.value = padding.detailed.top; + } else { + // Values are different, open the detailed editor and use first value for simple + marginInner.value = padding.detailed.top; + // Open detailed view after mount + setTimeout(() => { + if (marginInnerEditor.value) { + marginInnerEditor.value.expanded = true; + } + }, 0); + } } }