[Feature] New Post Settings Menu

[ErisDS]

The new PSM design is being constructed here: https://github.com/TryGhost/Ghost-UI/issues/99, markup is here.

It looks like this:

And works like this:

The new menu is more complex that the old version, as it has extensible sub-screens. There will likely be a number of child issues to implement the advanced functionality in Ember, as well as to implement each of the new features:

• Reimplement current PSM in new form Post Settings Menu 1: Add new with the existing settings #3936
• Add sub menu functionality Post Settings Menu 2: Sub menu and sub-views #3937
• Post image upload [Feature] Post Cover Images #3885
• Meta data screen Post Settings Menu 3: Meta data screen #3939
• DRY up closing of post rendering (PSM Step 1 #3965 (comment))

These sub issues are ready to start

[morficus]

I'm actually quite excited for this :-D

[PaulAdamDavis]

I've done a quick & dirty implementation of this, just to see how it feels. (It's not functional)

In doing that, I've had a good think about how this should be handled. It should be a similar way to how the mobile navigation is done – i.e. slide out from behind the <main> element, something like this:

<div id="container">

{{#unless hideNav}}
    {{partial "navbar"}}
{{/unless}}

<main id="gh-main">
    ...
</main>

{{outlet rightSidebarOrSomething}}

{{outlet modal}}

</div>

[novaugust]

Super pretty drawing.

I think the gif would be more useful if it was in the context of the entire screen

[novaugust]

More seriously, I think we want a second outlet here, following the modal pattern. That way, we're ready to go for other sidebars down the road, too

<div id="container">

{{#unless hideNav}}
    {{partial "navbar"}}
{{/unless}}

<main id="gh-main">
    ...
</main>

{{outlet offscreen-sidebar-menu-thing-sometimes-used-by-psm-but-also-but-other-things-too-maybe-later}}

{{outlet modal}}

</div>

Like that.

update maybe we could come up with a better name, but whatevs

[PaulAdamDavis]

@novaugust Outlet! Yes. That's what I was thinking of.

[PaulAdamDavis]

What I'm not sure about though, (and this is a design decision... cough @JohnONolan) is if the PSM should move the publish bar (tags) footer to the side as well, or just the editor. Or can both happen? A second outlet has utility in many places I imagine.

[JohnONolan]

Same as mobile menu - the entire screen moves over