Design
 Idea
  • Open XWIKI-14884 Make the Applications Panel admin UI simpler to discover and use
  • Open XWIKI-10498 Implement collapsing & expanding panels on Flamingo
  • Open XWIKI-10752 "More applications" content is not readable in condensed display
  • Open XWIKI-14581 The "More Applications" options from Applications Panel should be extended by default
 

Description

Overview

Covers some improvements ideas that could be applied to left panels area: 

  • Mark "More applications" as expandable 
  • Provide a "Customize" panel button on hover
  • Some styling changes
  • Demo: show sticky left panels would behave

Before
overview_before.png

After
overview_after.png

overview2_after.png

Expandable "More applications"

  •  Mark that "More applications" is expandable by using an arrow

before.png

after.png

  • Expanded state
  • Using the same bullets, arrows and colors as Tree

appbar_expanded_before.png

appbar_expanded_bafter.png

  • XWIKI-14884 issue suggested to also have App Index and Customize panel listed in the "More applications" section
    • "Manage panel" could be represented as a hover button (see next section)
    • "All applications" could remain listed just in the Drawer, with the other Indexes

appbar_expanded_bafter_more.png

"Customize" button on hover

  • Display a "Customize" button on panel hover that will take the user to admin/XWiki/XWikiPreferences?editor=globaladmin&section=panels.applications

appbar_customize_hover.png

  • Hovering the button will also display it's label "Customize" / "Configure" / "Manage"

appbar_customize_target.png

  • "Navigation" panel will also have a button taking the user to admin/XWiki/XWikiPreferences?editor=globaladmin&section=panels.navigation
  • This way both panels will have a similar way to customize them
  • The customisation button will be visible just by Global Admins that have access to the Administration

navigation_customize_hover.png

Other Idea: Sticky Left Panels

  • There were some discussions about having the panels and content area in individual containers that could scroll independently.
    • In this particular example just Left Panels is independent. Content and Right Panels are preserving the current behavior.
  • Another idea was to make the left panels sticky. This would be useful especially for KBs that use Navigation panel intensively. This is how the panels would behave.
    • Still the current skin layout is problematic since the logo is not visible when scrolling. Fixing the navbar would be too much, especially since we have bottom fixed bar for Save in Edit mode. 

GIF
AppBar.gif

Scrolling
Scrolling.gif

Screenshots
sticky.png

stickyAppBar.png

docextra_after.png


 

Tags:
Created by Ecaterina Moraru (Valica) on 2018/06/18 16:00
    

Get Connected