search

Byteclaw / visage

Visage design system
https://visage.design
MIT License
12 stars 3 forks source link

Add support for theme toggle in live previews #600

Closed michalkvasnicak closed 4 years ago

michalkvasnicak commented 4 years ago

Now after the refactor to iframes we've lost support for dark/light theme. We need to send this information to preview and then update it using window.postMessage().

michalkvasnicak commented 4 years ago

Now it's fixed by using key so we rerender example on theme change but the problem is that if you edit the code it won't be used in example on theme change.

michalkvasnicak commented 4 years ago

Maybe using https://www.gatsbyjs.org/docs/client-only-routes-and-user-authentication/ guide, I should try to make live-preview.tsx actually contain Router and make Live preview a subroute, maybe this one could help with the problem in dev mode, when sometime examples are not rendered at all.

michalkvasnicak commented 4 years ago

Ok client side only routes causes infinite redirect problem.

michalkvasnicak commented 4 years ago

Ok now I need to fix initial load of live preview because it show an error.

michalkvasnicak commented 4 years ago

I think now it's done. Only thing is that examples with a design system supplied (for example custom theme examples, etc) won't use the color mode because it's based on theme toggling.