I am sure I am missing something obvious here but after I have made multiple changes with the GUI how do I then go back to tweak them?
I would expect everything I have done to appear in the CSS editor so that I can manually adjust it, but it does not, and I can only find it in the non-editable viewer.
I guess I might use the non-editable viewer as an aide-mémoire but this isn’t hugely informative when I have targeted something highly specific in the very complex Toolset bootstrap layout that I am working on.
D’oh!, I have figured an (obvious!) work around. Copy and paste the CSS from the viewer back into the CSS editor and delete the selectors in the GUI, then I can fiddle with the CSS by hand but still add more with the GUI if I want.
Your solution for switching between GUI selectors and editing them later by pasting the CSS output to the Code editor sounds good to me. The View generated CSS code is currently read-only because it would take a lot of work to ensure that edits to the code update the GUI fields correctly. Ironing out the bugs would be a bit of a challenge. However, I recognise it would be a nice feature, and so haven’t ruled it out for the future.
In fact, when we add GUI support for animation keyframes, the plan is to provide a code editor view that can be used interchangeably with the GUI fields – a way to pilot the feature in a narrower context.
After posting the above it did occur to me that there could be a problem going in the reverse direction.
Just a heads up though, the interface of a certain well know competitor’s latest beta appears to offer both code and gui views on screen at the same time with two way communication between them.
I no longer have it installed though as I obtained a refund as soon as I tried yours because it is superior in just about every way (except possibly that)!
Well there is actually one option if you want to convert code back to the GUI. It isn’t as fluid as having two panes for switching between code and the GUI. But if you go to Packs > Import > CSS Stylesheet you can paste some arbitrary CSS code into the editor and then import it into Microthemer. A new GUI folder will be created for the imported CSS. Or several folders if you import more than 40 selectors. You can preview what will be imported before committing too.
Note: if you try to import a CSS style that Microthemer doesn’t have a GUI field for, it will be added to the inline code editor for the GUI selector (to the left of the Font property group).
