You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
We use Astro with UnoCSS to generate our CSS. In preview mode, we use the plugin "unocss/runtime" which generate CSS class at runtime.
Live preview is a nice feature but if we modify a field which generate new CSS the CSS it not generated by UnoCSS because we can't detect when the body is updated. It would be nice if a JS event is dispatched as the Astro Navigation work. Astro navigation dispatch events when the page swap.
Suggested solution or improvement
Dispatch an event when the body is updated in file /lib/live-preview/handleStoryblokMessage.ts
Hi, @bentouch-digital
We'll have a look at this issue. Please feel free to add additional resources to help us investigate. (i.e. Screen recording of the behavior you described, reproduction steps, etc)
I don't have any screen recording but the idea is just to dispatch a JS event when the body is updated.
If a Javascript event were dispatched, we could do this:
document.addEventListener('storyblok-astro-live-preview-body-updated',()=>{// Here is the callback we could run code every time the body is updated via live previewconsole.log('Live preview: body updated');initUnoCssRuntime();// With this line all our CSS is regenerated});
A new event is introduced that triggers when changes are made in the Storyblok Visual Editor.
This is particularly helpful for generating CSS dynamically, as outlined in issue #864.
Description
Hi,
We use Astro with UnoCSS to generate our CSS. In preview mode, we use the plugin "unocss/runtime" which generate CSS class at runtime.
Live preview is a nice feature but if we modify a field which generate new CSS the CSS it not generated by UnoCSS because we can't detect when the body is updated. It would be nice if a JS event is dispatched as the Astro Navigation work. Astro navigation dispatch events when the page swap.
Suggested solution or improvement
Dispatch an event when the body is updated in file
/lib/live-preview/handleStoryblokMessage.ts
Additional context
No response
Validations
The text was updated successfully, but these errors were encountered: