Skip to content

applets/kickoff: Refine header

In the past, the layout of the header was strongly connected to the arrangement of the panes below it: the avatar and its text were constrained to the width of the sidebar, and the search field plus buttons were constrained to the width of the main view.

This worked less well when we added an option to allow moving the sidebar over to the other side; the header layout no longer made sense, and when reversed, it looked rather awkward.

This commit resolves the issue by making the header layout be independent of the layout of the view below it, introducing a visually pleasing centered search field style that looks good no matter which side the sidebar is located on.

In the process, the text beside the avatar had to be removed to make room, but it was usually elided into uselessness and hence of questionable value, so hopefully this is no great loss. If the avatar is not showing a user picture, we instead hide it and do show the user's name.

I tested keyboard focus with the tab and arrow keys in both LTR and RTL modes.

Normal mode "Reversed sidebar" mode
Normal Reversed_sidebar_mode

@teams/vdg @ndavis @forestix

Edited by Nate Graham

Merge request reports