| 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.
Primary action buttons, such as Save or Cancel, will be aligned to the right. Secondary actions, if exist, will be shown on as a toolbar, 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 2/3 of the height of its the container, the action area will appear below the last form fieldat a 2/3 height.
If the form exceeds 2/3 of the height of its the container, the action area will stick to the bottom of the container, allowing users to scroll the form above it, if needed.
Inside dialog popups and 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.
...