Skip to content
This repository was archived by the owner on Oct 8, 2021. It is now read-only.
This repository was archived by the owner on Oct 8, 2021. It is now read-only.

Smart and accessible navbars for tablets and phones #5436

Closed
@istrasoft

Description

@istrasoft

Hi all,

I would like to point out that currently the navbars support max 5 elements before turning into a two-column collection of buttons. However, a nicer approach would be possible for emulating the native navbars that can be seen in iOS and Android for example.

On iOS devices, navbars are not limited to 5 buttons for example (8 items on iPads).
on iPhone, when there are more than 5 elements in a navbar, a "More" button is added and the remaining items are placed in a popup list/menu/whatever.

So the suggestion would be to :

  1. Extend the maximum of buttons per row in a navbar to 8 (easy, I can provide the code)

  2. Make $.fn.grid function not handle hidden children buttons when calculating and styling the navbar. This would allow for media queries to hide/show buttons depending on the available page width for example. Currently the code is $kids = $this.children() so display:none children are handled as visible buttons.

  3. A super duper navbar would detect when the available width is not enough to display all buttons and would switch to the "More" button and display the remaining items using a Popup for example. That's how I do it now in my app, but its hacky at best ...

Thanks !

(P.S. I didn't mean to attach this to milestone 1.4.0 ...)

PPS. Just saw that there was already a suggestion very similar to this added to the features suggestions 2 years ago and no news since. #1677. Would you consider this in the not so far future maybe please ? It's kind of a core feature in most mobile OSes ... Thanks !

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions