UX: Add Styling step to wizard (PR #14132)

This is a refactor of three wizard steps (colors, fonts, homepage style) which are now merged into this new step called Styling.

Here’s a screencast to show how the new step looks and behaves:


Since we’re in here - can we instead trigger an action when the value changes in select kit and remove the observer?

Overall this is looking EXCELLENT and I can’t wait to merge it.

Same here - can we use onChange in selectKit?

I think I’ve done this in UX: Add Styling step to wizard by pmusaraj · Pull Request #14132 · discourse/discourse · GitHub. It’s still a little awkward, because I found it necessary to add a new property, stylingDropdown, that is passed down to the preview components. Let me know if this is not what you had in mind.

We’re quite close now!

You should initialize objects (and arrays) in an init method otherwise each instance of the component will end up with a reference to the same thing. I think in this case it’ll be fine, but it’ll help in the future if someone decides to mutate that object.