fix: restore TextSettings functionality after store refactoring
All checks were successful
Deploy / Build and Deploy to Production (push) Successful in 16s
All checks were successful
Deploy / Build and Deploy to Production (push) Successful in 16s
Fixed TextSettings fields not updating the stylesheet and preview after the store refactoring that made content a computed property. - Add missing font watcher in TextSettings.vue - Update useCssUpdater.js to use store.replaceBlock() instead of writing to readonly store.content - Update createRule() to append to store.customCss instead of store.content All TextSettings fields (font, size, margins, padding, alignment) now correctly update the stylesheet and preview. Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
e42eeab437
commit
cb5d056b51
2 changed files with 10 additions and 5 deletions
|
|
@ -452,6 +452,11 @@ const updateMarginInnerUnit = (unit) => {
|
|||
};
|
||||
|
||||
// Watchers for body styles
|
||||
watch(font, (val) => {
|
||||
if (isUpdatingFromStore) return;
|
||||
updateStyle('body', 'font-family', `"${val}"`);
|
||||
});
|
||||
|
||||
watch(italic, (val) => {
|
||||
if (isUpdatingFromStore) return;
|
||||
updateStyle('body', 'font-style', val ? 'italic' : 'normal');
|
||||
|
|
|
|||
|
|
@ -14,13 +14,13 @@ export function useCssUpdater() {
|
|||
new RegExp(`(${property}:\\s*)[^;]+`, 'i'),
|
||||
`$1${value}`
|
||||
);
|
||||
store.content = store.content.replace(currentBlock, updatedBlock);
|
||||
store.replaceBlock(currentBlock, updatedBlock);
|
||||
} else {
|
||||
const updatedBlock = currentBlock.replace(
|
||||
/(\s*})$/,
|
||||
` ${property}: ${value};\n$1`
|
||||
);
|
||||
store.content = store.content.replace(currentBlock, updatedBlock);
|
||||
store.replaceBlock(currentBlock, updatedBlock);
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -37,7 +37,7 @@ export function useCssUpdater() {
|
|||
);
|
||||
|
||||
if (updatedBlock !== currentBlock) {
|
||||
store.content = store.content.replace(currentBlock, updatedBlock);
|
||||
store.replaceBlock(currentBlock, updatedBlock);
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -57,7 +57,7 @@ export function useCssUpdater() {
|
|||
}
|
||||
|
||||
if (updatedBlock !== currentBlock) {
|
||||
store.content = store.content.replace(currentBlock, updatedBlock);
|
||||
store.replaceBlock(currentBlock, updatedBlock);
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -65,7 +65,7 @@ export function useCssUpdater() {
|
|||
* Create a new CSS rule for a selector
|
||||
*/
|
||||
const createRule = (selector) => {
|
||||
store.content += `\n\n${selector} {\n}\n`;
|
||||
store.customCss += `\n\n${selector} {\n}\n`;
|
||||
return `${selector} {\n}`;
|
||||
};
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue