Skip to content

Add New Nested Layout for Editor Page #1079

@John-Paul-Larkin

Description

@John-Paul-Larkin

Context

As part of "Meta issue : Editor #1022 we need to add a new nested layout for the editor page.
This new layout will be a sticky nav and contain navigation and other things relating specifically to the editor.

  • Remove "Your posts" and "+ New post" from the navigation bar, as they are not necessary on the editor page.
  • Remove "Save status indicator, and the "Publish" button from the editor(as they will now be on the nav)

Add a sticky navigation bar that includes elements and actions relevant to the editor, such as:

  • Codu logo (which remains as a home link).

  • Notifications.

  • Dark mode toggle.

  • User icon.

  • Move the "Publish" button from the editor to the sticky navigation.

  • Add a status indicator to reflect the save status of the editor:
    Note - Check out how this should be implemented in Nialls Figma image in the comment below.

- The status indicator should disappear while the user is typing.
- After a short delay once typing stops, a "Saving..." message should appear, possibly accompanied by a loading spinner.
- Once the content is successfully saved, the message should change to "Saved".

Take a look at how medium.com implements their editor nav to get a sense of the user experience and design we're aiming for.

Screenshots

Current nav

Additional info

The alpha editor can be found at :

app>(app)>alpha>new

Any questions feel free to ask.

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions