| Table of Contents |
|---|
...
in the main workspace.
inside various containers, including Dialog popups, Popovers,Wizards,Filter panes, Details panes and Cards.
...
For the usage and behavior of inline inputs, see Inline Inputs.
Where possible, field labels will appear above the input field.
Where relevant, a red mandatory indicator (*) will be shown next to the label.
Where relevant, a help icon will appear next to the label (aligned to the right side of the field, if possible).
...
The action area will always be visible.
Main action buttons are aligned to the right. If needed, buttons for secondary actions such as clear or delete will be aligned to the left.
Where the form takes up the entire workspace, the action area will appear at the top of the page. (See Examples below).
In all other cases, the action area will appear below the form.
In widgets within the workspace, the action area will be separated by a horizontal line.
If the form does not exceed the height of its container, the action area will appear below the last form field.
If the form exceeds the height of its container, the action area will stick to the bottom of the container, allowing users to scroll the form above it.
Inside other containers, the action area will appear at the bottom of the container (see Examples below).
 |  |
States
Forms can have two states:
Idle / Saved. Applies when entering a form or after clicking the Submit button. In this case, the Submit button is disabled.
Edited. Applies after making changes to the form but before clicking the Submit button. In this case:
the Submit button is enabled.
attempting to leave the form will trigger a confirmation message. See Validation and errors below.
...