[MAGNOLIA-4308] Improve handling and look of Page, Area and Component edit bars Created: 25/Oct/11  Updated: 22/Mar/12  Resolved: 22/Dec/11

Status: Closed
Project: Magnolia
Component/s: page editor
Affects Version/s: None
Fix Version/s: 4.5

Type: Improvement Priority: Major
Reporter: Andreas Weder Assignee: Unassigned
Resolution: Fixed Votes: 0
Labels: None
Σ Remaining Estimate: Not Specified Remaining Estimate: Not Specified
Σ Time Spent: Not Specified Time Spent: Not Specified
Σ Original Estimate: Not Specified Original Estimate: Not Specified

Attachments: PNG File Location of Top-Level Area Bars.png    
Sub-Tasks:
Key
Summary
Type
Status
Assignee
MAGNOLIA-4331 Change appearance of areas and compon... Sub-task Closed Espen Jervidalo  
MAGNOLIA-4332 Use different color scheme for area e... Sub-task Closed Espen Jervidalo  
MAGNOLIA-4333 Implement distinct appearance of area... Sub-task Closed Philipp Bärfuss  
MAGNOLIA-4334 Rendering of edit bars in-line before... Sub-task Closed Philipp Bärfuss  
MAGNOLIA-4335 Make (only) top-level area edit bars ... Sub-task Closed Philipp Bärfuss  
MAGNOLIA-4336 Implement appearance of optional areas Sub-task Closed Espen Jervidalo  
MAGNOLIA-4337 Separating buttons into groups Sub-task Closed Espen Jervidalo  
MAGNOLIA-4338 Implement inheritance for areas Sub-task Closed Philipp Bärfuss  
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:

 Description   

The new concept of Area edit bars and the demise of the New bar requires some changes to how edit bars look and behave.

The current problems are:

  • a single component area is represented by only one (area) edit bar, which reduces visual noise, but also requires tricks and special handling of buttons
  • the overall appearance is inconsistent (e.g. the "edit" button is on the right side for areas, on the left for "components")
  • bars are sometimes rendered before their elements, sometimes below (breadcrumb) or above it (page edit bar). Apart from inconsistencies, this may cover clickable content.
  • button names are long ("edit component", "add component")
  • buttons could be labeled more consistently and in-line with current Magnolia (e.g. using the "New" for adding a component).
  • bars of areas, especially of top-level areas, seem to be frequently "in the way" in the sense that you have to show them although they are only of reduced interest to a typical editor

In addition, we can already prepare for Magnolia 5 by introducing some changes now (e.g. moving the "edit" button on the right and using a different color for area edit bars).

This issue basically introduces the following main changes:

  • all area edit bars work the same, whether they have no, one or n components
  • all edit bars except top-level area bars are rendered in-line and non transparent
  • non-editable area bars are rendered using a reduced bar
  • top-level area bars are hovering above content and are rendered using a reduced bar
  • area edit bars use a color other than light blue
  • some consistency changes for button names and positions


 Comments   
Comment by Andreas Weder [ 26/Oct/11 ]

Added a mockup showing the major implications of most of the proposed changes mentioned here.

Comment by Philipp Bärfuss [ 22/Dec/11 ]

sub tasks done

Generated at Mon Feb 12 03:54:34 CET 2024 using Jira 9.4.2#940002-sha1:46d1a51de284217efdcb32434eab47a99af2938b.