Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Buttons allow the user to perform a defined single action, such as navigating to a different view, choosing an option, or completing a task. These actions are always in context, relating to the container it's located in, such as a screen, form, wizard, popup, popover, etc..

Image Modified
Image Removed
Image Added

Types

Type

Image

Usage

Dialog Buttons

Image Modified

Use for primary and secondary actions.

Icon Buttons

Image Modified

Use in areas where dialog buttons won’t comfortably fit, such as toolbars and tables.

Split Buttons

Image Modified

Use when there are multiple related actions, with one primary action (e.g. the most frequently used).

Switch Buttons

Image Modified

Use to quickly switch between binary options, e.g. On/Off.

Ribbon Buttons

Image Modified

Use within the /wiki/spaces/UserExp/pages/1390479038 component.

Usage & Behavior

General guidelines

...

  • Clicking the button target area will initiate its action.

  • When hovering, the mouse cursor changes from a pointer to a hand.

Image Modified

Validations and errors

...