[MGNLUI-8649] Styling of app tree view table updates Created: 08/Jan/24  Updated: 31/Jan/24  Resolved: 26/Jan/24

Status: Closed
Project: Magnolia UI
Component/s: None
Affects Version/s: None
Fix Version/s: 6.3.0, 6.3

Type: Task Priority: Neutral
Reporter: Laura Delnevo Assignee: Sang Ngo Huu
Resolution: Fixed Votes: 0
Labels: dx-core-6.3, searchx
Remaining Estimate: 0d
Time Spent: 2d 5.5h
Original Estimate: Not Specified

Issue Links:
Cloners
clones PAGES-1453 Styling of Pages app tree view table ... Closed
Relates
relates to MGNLUI-8661 Show ellipsis when text goes off the ... Open
relates to MGNLUI-8671 Styling improvements to Treeview Open
dependency
is depended upon by MGNLDAM-1263 Styling of Assets app tree view table... Closed
is depended upon by PAGES-1453 Styling of Pages app tree view table ... Closed
Template:
Acceptance criteria:
Empty
Task DoR:
Empty
Documentation update required:
Yes
Date of First Response:
Epic Link: SearchX 1. In-App search & Top Nav
Team: AuthorX
Work Started:
Approved:
Yes

 Description   

As an author, I want to be able to easily identify content within the Tree view mode, so that I can find my relevant content faster.

 

Pages app tree view table updates

  • Table header UI updates (check dev mode on Figma for styling details)
    • The header is now white instead of grey
    • The option to filter got removed
    • The text styling changed
    • The 'Indeterminate' checkbox state gets added
  • Table grid UI updates (check dev mode on Figma for styling details)
    • The row height increased
    • The text styling changed
    • The 'Page' and 'Title information gets merged in the same column
      • The 'Title' becomes the hero information of each item in the pages app
      • The 'Page' information gets incorporated together with the page path (e.g.: /travel/about/careers/customer-experience-agent)
      • If the Title/Path info happens to be longer than the column, 'ellipses...' should be added at the end of the visible part of the content - the full information can be uncovered by expanding the column as it works currently Follow up ticket MGNLUI-8661 to fix ellipses behaviour 
    • 'Modification date' column to read 'Last updated'
    • Remove the icon before the Page title

 

Designs



 Comments   
Comment by Patricia Rodrigues [ 30/Jan/24 ]

sang.ngo Design review: 

  • The ‘indeterminate’ checkbox state in the table header is not yet working - check design component here
  • Remove ‘Page’, ‘ABn test status’ and ‘Tags’ columns from pages default. The ‘Page’ column is redundant in any scenario.
  • When text gets cut off is not yet showing the ellipses – follow-up ticket: MGNLUI-8661
  • Lastly, the gap between the page name and the path should be smaller as per design file, but we could create a new ticket to improve the row style, that includes this plus some new design updates I would like to do regarding our discussion on the different tree view levels cc/ldelnevo 
Generated at Mon Feb 12 09:57:05 CET 2024 using Jira 9.4.2#940002-sha1:46d1a51de284217efdcb32434eab47a99af2938b.