Short description

The more menu is a contextual menu that is used to find actions connected to an area or item.

Alternative names

This menu is sometimes called Overflow menu. The reason is that android uses this to automatically push the options that don’t fit on the screen into this menu. So tabs/buttons that are visible on a desktop, is hidden in this menu when the screen is smaller.

When and how to use it

Use the More menu to give users all the options: that you can’t fit in the regular view, or that you don’t want to clutter the interface. 

Behaviour

It uses a button that triggers a fold-out-modal/dropdown (desktop) or slide-up-modal (mobile).

Destructive items

Some items in the menu may be destructive. Typical example is Delete. These items behave like the delete-button and are displayed in red.

Placement

The dropdown is often used in the top-right corner of a widget, or at the end of a table-row.  

When it needs a label, consider using Options or Actions ("Välj").

Note that this component hides functions for the user. 

• Don't hide critical functionality
• Avoid using the menu if there is only one item
• Make sure to have a descriptive label with the icon

Make out of different building blocks:

• Icon button (Button)
• Select list (Dropdown)

Implemented in Angular as Context Menu.