Hi everyone,
= Short Story =
I propose to change the behaviour of the top level menu from Flamingo
for tablet and desktop screens (so NOT for phones) to match the
behaviour we had in 6.2 BUT improving the separation between the
navigation links and the drop down toggle. The idea is that the top
level menu entries should behave like a drop down button (e.g. the Add
button) but without looking like one. You can see some screen shots at
http://jira.xwiki.org/browse/XWIKI-11517.
= Long Story =
I've heard complains that the current behaviour of the top level menu
from Flamingo skin is not perfect. The issue is that you need to click
twice to navigate. Ok, with a mouse you can use the middle click
(wheel) to open the link in a new tab but still it's annoying for
simple uses and for those that use the touch pad or a tablet.
An alternative I have investigated in
http://jira.xwiki.org/browse/XWIKI-11479 is to open the menu on hover
(on devices that support this of course). The result is quite nice and
effective but there is a problem: if you have a second horizontal menu
displayed under the top level menu then you'll have a hard time
hovering the second menu. So I decided to close XWIKI-11479 as Won't
Fix. For those that like the open-on-hover behaviour and which don't
plan to use a second menu I've published this extension
http://extensions.xwiki.org/xwiki/bin/view/Extension/Hover+and+Default+Acti…
.
The other alternative to fix the problem is to go back to the
behaviour from 6.2. Precisely, each menu has two sides:
* on the left is the label which is a link used for navigation
* on the right there is a toggle (arrow) used to open the menu.
The problem with this, and the reason we change it in 6.3, was that
the label and the toggle were not separated very well so the user
could easily think they were doing the same action (opening the menu).
At the same time this separation felt unnatural on extra small screens
(phones) because you couldn't tap easily on the toggle (arrow).
The solution I propose is to:
* Keep the current behaviour for extra small screens (phones). That
means the use has to tap twice to navigate: one tap to open the menu
and another one on the "Go to this XYZ".
* On desktop and tablet enable the default action (navigation link) as
in 6.2 but improve the separation so that the menu behaves as much as
possible as a drop down button (e.g. the Add button) without looking
like one. This means:
** You should understand there are two sides without hovering
** Separate hover and active state (e.g. the link is not hovered when
the toggle is hovered)
I've investigated *many* ways to achieve this and the result can be
seen on
http://jira.xwiki.org/browse/XWIKI-11517. This is close to
http://extensions.xwiki.org/xwiki/bin/view/Extension/Enable+Default+Action+…
but not the same.
NOTE: The way the menu behaves and looks on hover and click (text and
background color) is strictly determined by the color theme. Some
themes highlight the hovered menu items by changing their background
color, others the text color and some do both. My changes are
independent on this. We can of course improve the default color theme
to better highlight the menu items. This is a different topic though.
I'd like to commit this changes in 6.4. Here's my +1.
Thanks,
Marius