[MGNLUI-5835] Instant split-mode preview Created: 23/Apr/20  Updated: 11/May/20

Status: Open
Project: Magnolia UI
Component/s: None
Affects Version/s: None
Fix Version/s: None

Type: Story Priority: Neutral
Reporter: Antti Hietala Assignee: Unassigned
Resolution: Unresolved Votes: 0
Labels: None
Remaining Estimate: Not Specified
Time Spent: Not Specified
Original Estimate: Not Specified

Template:
Acceptance criteria:
Empty
Task DoD:
[ ]* Doc/release notes changes? Comment present?
[ ]* Downstream builds green?
[ ]* Solution information and context easily available?
[ ]* Tests
[ ]* FixVersion filled and not yet released
[ ]  Architecture Decision Record (ADR)
Date of First Response:
Epic Link: Merge preview features

 Description   

Create a new layout for side-by-side (split mode) editing and preview.

Benefits

  • Instantly see what impact your content changes have on the experience.
  • Common feature in headless competitors (often done via static site generator)

Behavior

  • Changes to the content are instantly shown in the preview. (autosave, autorefresh behavior)
  • Toggle in action bar toggles between normal and split screen modes.
  • In split mode, form layout is on the left and preview is on the right.
  • In the form, field labels move to the top of the field to save horizontal space.
  • Preview action bar controls the preview mode (desktop, mobile etc.) just like in normal (non-split) preview.
  • Edit action bar provides the basic actions on the content item, such as Rename, Duplicate and Publish.

Mockup



 Comments   
Comment by Antti Hietala [ 24/Apr/20 ]

To do: Specify requirements for scaling. Split screen cannot show a desktop preview in full 100% resolution, there just isn't enough screen real estate for that. So what should we do? Do we scale the desktop preview down to fit in the viewport? Or do we assume that responsive design adapts to the viewport?

Generated at Mon Feb 12 09:30:32 CET 2024 using Jira 9.4.2#940002-sha1:46d1a51de284217efdcb32434eab47a99af2938b.